Pricing
Get Started
  • Introduction
  • Installation
  • MCP Server
  • Saved
Site
  • Builder (Beta)
  • Pricing
  • Roadmap
  • Affiliates
Browse
  • All Components80 New
Text34
  • 3D Letter Swap
  • 3D Text Reveal
  • ASCII Ripple
  • Bending Marquee
  • Blur Highlight
  • Cipher RevealNew
  • Domino LetteringNew
  • Elastic LetteringNew
  • Ghost TypeNew
  • Glitch Text
  • Glyph LotteryNew
  • Gravity LettersNew
  • Label OrbitNew
  • Luminous TypeNew
  • Mesh LetteringNew
  • Orbital TypeNew
  • Particle Text
  • Ribbon TypeNew
  • Rising InkNew
  • Shatter TypeNew
  • Signal TypeNew
  • Smoke TypeNew
  • Speeding Text
  • Spring LetteringNew
  • Staggered Text
  • Stipple TypeNew
  • Tessera TrailNew
  • Text Cube
  • Text MorphNew
  • Text Path
  • Text Scatter
  • Typographic WallNew
  • Vapor TypeNew
  • Wave LetteringNew
Backgrounds98
  • ASCII Tiles
  • Ascii Waves
  • Astral ShellNew
  • Aura Blob
  • Aurora Beam
  • Aurora Blur
  • Axial BeamNew
  • Binary OrbitsNew
  • Black Hole
  • Blinking Dots
  • Blinking Squares
  • Blurred Rays
  • Chroma Blinds
  • Chroma CurrentNew
  • Chroma Waves
  • Cloud AtlasNew
  • Color Loops
  • Concentric TidesNew
  • Contour TideNew
  • Dappled LightNew
  • Dither Wave
  • Dot Shift
  • Eclipse
  • Fading StarsNew
  • Falling Rays
  • Flame Paths
  • Fog Sphere
  • Glass Flow
  • Glass Tiles
  • Glimmer WrapNew
  • Glitter Warp
  • Glowing Ridges
  • Glowing Wave
  • Glue Dots
  • Glyph EmberNew
  • Glyph OrbNew
  • Glyph SonarNew
  • Glyph TideNew
  • Gradient Bars
  • Grain Wave
  • Halftone Vortex
  • Halftone Wave
  • Hexagonal VaultNew
  • Horizon BloomNew
  • Interference RibbonsNew
  • Landscape
  • Light Droplets
  • Lightspeed
  • Liquid Bars
  • Liquid Lines
  • Long Exposure
  • Luminous FilamentsNew
  • Metallic Swirl
  • Minimal Ripple
  • Mosaic
  • Mosaic Waves
  • Neon Reveal
  • Neural Flash
  • Neural Float
  • Neural Tunnel
  • Nexus RaysNew
  • Perspective Grid
  • Photon KnotNew
  • Pixel Rain
  • Prismatic SlatsNew
  • Radial Liquid
  • Ravine
  • Retro Lines
  • Ring FieldNew
  • Rising Lines
  • Rising Particles
  • Rolling Blinds
  • Rotating Stars
  • Rubber Fluid
  • Satin RidgesNew
  • Shader Waves
  • Shadow Bars
  • Silk Waves
  • Simple Swirl
  • Specter Orb
  • Spectral Clouds
  • Spectral DrapeNew
  • Spiral FunnelNew
  • Square Matrix
  • Squares Terminal
  • Squircle Shift
  • Star Swipe
  • Swirl Blend
  • Synaptic Shift
  • Tech Wall
  • Terminal RainNew
  • Thinking Dots
  • Twilight Lines
  • Vortex
  • Voxel ArcNew
  • Warp Twister
  • Watercolor
  • Wireframe Ball
3D & Shaders49
  • Agentic Ball
  • AI Blob
  • Album RailNew
  • Bend Gallery
  • Chrome OrbitNew
  • Circle Stack
  • Concave CarouselNew
  • Constellation GalleryNew
  • Contact SheetNew
  • Depth Card
  • Depth Image
  • Depth RibbonNew
  • Device
  • Dolly Gallery
  • Elastic ReelNew
  • Elastic StickerNew
  • Ember RevealNew
  • Expanding GridNew
  • Frame Border
  • Glass Reveal
  • Globe
  • Gradient Blob
  • Helix GalleryNew
  • Infinite Gallery
  • Inverted Dome
  • Iris GalleryNew
  • Lenticular Carousel
  • Momentum RingNew
  • Page Flip
  • Parallax Carousel
  • Particle Image
  • Particle Morph
  • Passage GalleryNew
  • Pixel Reveal
  • Pixel Sculpt
  • Pixelate Hover
  • Pond ImageNew
  • Portal
  • Prism CarouselNew
  • Rotating Cards
  • Scroll BendNew
  • Scroll Portal
  • Shader Card
  • Shader Reveal
  • Spin ShutterNew
  • Star Burst
  • Tumble Carousel
  • Twisting Gallery
  • Warped Card
Cursor Effects21
  • Arc CursorNew
  • Ascii Cursor
  • Celebration CursorNew
  • Chroma HaloNew
  • Cursor Wave
  • Custom Cursor
  • Dither Cursor
  • Drafting CursorNew
  • Glass Cursor
  • Glyph StreamNew
  • Grid Rise
  • Gyroscope CursorNew
  • Liquid Ascii
  • Parallax Pills
  • Pigment TrailNew
  • Pixel Magnet
  • Ribbon TrailNew
  • Smooth Cursor
  • Snapshot TrailNew
  • Stardust CursorNew
  • User Cursor
UI & Cards28
  • Animated List
  • Card Spread
  • Center Flow
  • Chroma Card
  • Circle Gallery
  • Circles
  • Click Stack
  • Comparison Slider
  • Credit Card
  • Draggable Grid
  • Frame Scrub
  • Gradient Carousel
  • Hover Preview
  • Liquid Swap
  • Loupe ImageNew
  • Magic Transform
  • Modal Cards
  • Orbit ReelNew
  • Parallax Cards
  • Preloader
  • Reel Gallery
  • Scroll Mask
  • Scroll Stack
  • Simple Graph
  • Skewed Carousel
  • Tile Reveal
  • Tilted Tiles
  • Tumble WallNew
  1. Docs
  2. Components
  3. Backgrounds
  4. Blinking Squares

Animated components, blocks, and templates for React. Pay once, ship stunning pages forever.

pro@reactbits.dev

Site

HomeBuilder (Beta)PricingTestimonialsFAQsRoadmapChangelogFree Components

Docs

IntroductionInstallationMCP ServerComponentsBlocksTemplates

Resources

AboutUse casesComparisonsAlternativesFor AI agents

Legal & Account

LoginAffiliateLicensePrivacyContact

© 2026 pro.reactbits.dev. All rights reserved.

Blinking Squares

A grid of little squares that quietly twinkle

blinking-squares-tw
pro.reactbits.dev
ComponentsBlocksTemplatesPricing
Get Pro

Quiet details, lasting impressions

Premium animated components and blocks, crafted to make your next launch feel alive.

Get startedBrowse library
9:41

Quiet details, lasting impressions

Premium animated components and blocks, crafted to make your next launch feel alive.

Get startedBrowse library

Quiet details, lasting impressions

Premium animated components and blocks, crafted to make your next launch feel alive.

Get startedLearn more

Customize

Grid Size
52
Square Size
0.57
Fade Start
0.33
Fade End
1.00
Falloff
1.25
Min Brightness
0.55
Twinkle Speed
1.40
Twinkle Strength
0.94
Intensity
1.00
Opacity
1.00
Square Color
Background

Props

14
NameTypeDefaultDescription
direction"right" | "left" | "top" | "bottom""right"Edge the dense squares are anchored to. The grid fades to empty in the opposite direction
gridSizenumber52Number of grid cells along the long axis (8–200). Higher = finer grain
squareSizenumber0.57Constant square fill % within each cell (0.05–0.98). All squares are uniform size; density is what varies
fadeStartnumber0.65Where the field first becomes non-empty along `direction` (0–1). Anything before this is pure background
fadeEndnumber1Where the field reaches full density along `direction` (0–1). Must be greater than fadeStart
falloffnumber1.25Curve sharpness between fadeStart and fadeEnd. 1 = linear, higher = stays empty longer then ramps fast (0.3–6)
minBrightnessnumber0.55Minimum brightness of a lit cell (0–1). Lit cells get a random brightness between this and 1.0
twinkleSpeednumber1.4Per-cell twinkle rate in cycles per second (0–4). 0 freezes the field
twinkleStrengthnumber0.94Strength of the per-cell brightness oscillation (0–1). 0 = no blinking
intensitynumber1Master brightness multiplier (0–2)
opacitynumber1Master alpha (0–1)
squareColorstring"#BB29FF"Square color in hex
backgroundColorstring"#000000"Background fill where the field is empty, in hex
dprnumber1.5Maximum device pixel ratio cap (1–3)
direction"right" | "left" | "top" | "bottom"

Edge the dense squares are anchored to. The grid fades to empty in the opposite direction

Default"right"
gridSizenumber

Number of grid cells along the long axis (8–200). Higher = finer grain

Default52
squareSizenumber

Constant square fill % within each cell (0.05–0.98). All squares are uniform size; density is what varies

Default0.57
fadeStartnumber

Where the field first becomes non-empty along `direction` (0–1). Anything before this is pure background

Default0.65
fadeEndnumber

Where the field reaches full density along `direction` (0–1). Must be greater than fadeStart

Default1
falloffnumber

Curve sharpness between fadeStart and fadeEnd. 1 = linear, higher = stays empty longer then ramps fast (0.3–6)

Default1.25
minBrightnessnumber

Minimum brightness of a lit cell (0–1). Lit cells get a random brightness between this and 1.0

Default0.55
twinkleSpeednumber

Per-cell twinkle rate in cycles per second (0–4). 0 freezes the field

Default1.4
twinkleStrengthnumber

Strength of the per-cell brightness oscillation (0–1). 0 = no blinking

Default0.94
intensitynumber

Master brightness multiplier (0–2)

Default1
opacitynumber

Master alpha (0–1)

Default1
squareColorstring

Square color in hex

Default"#BB29FF"
backgroundColorstring

Background fill where the field is empty, in hex

Default"#000000"
dprnumber

Maximum device pixel ratio cap (1–3)

Default1.5