Components · React Bits + Aceternity + Componentry
Split Text
chars/words split + staggered entrance
Blur Text
words reveal from blur to sharp
Circular Text
text laid in a rotating ring
Count Up
number animates 0→target
Curved Loop
text on a curved path looping endlessly
Decrypted Text
scrambled chars resolve into real text
Falling Text
letters drop with gravity + pile up
Fuzzy Text
noisy fuzzy displaced edge on hover
Glitch Text
RGB-split datamosh glitch flicker
Gradient Text
moving color gradient sweeping the fill
Rotating Text
cycles words, sliding each in/out
Scrambled Text
letters scramble on hover then settle
Scroll Float
text rises into place on scroll
Scroll Reveal
words fade/blur in line-by-line on scroll
Scroll Velocity
marquee text skews with scroll velocity
Shiny Text
moving shine glare sweeps across text
Shuffle
characters shuffle into the final string
Text Cursor
trail of characters follows the cursor
Text Pressure
variable-font thickens by cursor proximity
Text Type
typewriter typing + deleting with caret
True Focus
focused word sharpens, others blur, cycling
Variable Proximity
per-letter weight shifts by cursor distance
ASCII Text
text rendered as animated ASCII art
Colourful Text
per-letter animated multicolor text
Flip Words
cycles a word list with flip transition
Text Generate
words fade/blur in one-by-one (AI-typing)
Text Hover
SVG text fills/strokes following cursor
Text Reveal Card
hover wipes to reveal hidden text
Typewriter
text typed char-by-char with cursor
Cover
animated highlight cover sweeping over text
Squiggly Text
animated squiggly underline path
Container Text Flip
word in a container flips/cycles
Split-Flap Board
airport split-flap flipping text
Hyper Text
scrambles letters then settles
Letter Cascade
letters scatter + blur then reassemble
Text Repel
letters repel away from the cursor
Pointer Highlight
framed highlight box with pointer label
Aurora
flowing aurora gradient waves
Balatro
swirling psychedelic shader gradient
Ballpit
physics pit of bouncing 3D balls
Beams
light beams/streaks sweeping across
Beams w/ Collision
falling beams explode on a baseline
Color Bends
bending warping color-gradient field
Dark Veil
dark animated veil/smoke shader
Dither
animated retro dithered gradient
Dot Field
dots wave to cursor proximity
Dot Grid
grid of dots ripple around cursor
Faulty Terminal
CRT terminal scanline glitch
Ferrofluid
magnetic ferrofluid blob spikes/morphs
Floating Lines
drifting flowing line streaks
Galaxy
rotating starfield/galaxy of points
Gradient Blinds
gradient through venetian-blind slats
Grainient
grainy animated gradient
Grid Distortion
grid warped by a cursor lens
Grid Motion
grid of tiles drifting opposite ways
Grid Scan
scan line sweeping a glowing grid
Hyperspeed
hyperspace light-streak highway tunnel
Iridescence
oil-slick holographic shimmer shader
Letter Glitch
matrix grid of glitching letters
Light Pillar
vertical volumetric light beam
Light Rays
god-rays radial beams from a point
Lightfall
falling streaks of light particles
Lightning
animated lightning bolts/arcs
Line Waves
waving horizontal line patterns
Liquid Chrome
reflective liquid-chrome metal shader
Liquid Ether
flowing ink fluid following cursor
Orb
glowing animated orb reacting to hover
Particles
particle field reacting to cursor
Pixel Blast
bursting pixel particle field
Pixel Snow
falling pixelated snow particles
Plasma
classic animated plasma color shader
Plasma Wave
wavy flowing plasma energy ribbon
Prism
rotating 3D prism refracting light
Prismatic Burst
radial prismatic rainbow burst
Radar
sweeping radar scan with blips
Ripple Grid
grid ripples in waves from cursor
Shape Grid
grid of shapes morph on interaction
Side Rays
light rays from the side edge
Silk
flowing silk fabric shader waves
Threads
thread lines bend toward the cursor
Waves
animated wavy line/grid wave field
Vortex
swirling particle vortex backdrop
Meteors
diagonal shooting-meteor streaks
Shooting Stars
starfield with periodic shooting stars
Sparkles
configurable sparkle/particle overlay
Background Boxes
grid of boxes color on hover
Gradient Animation
morphing gooey gradient blobs
Background Lines
flowing SVG line paths
Background Ripple
grid ripples outward from click
Wavy Background
layered sine waves background
Grid & Dot Bg
grid / dotted background patterns
Noise Background
film-grain noise texture background
Circuit Board
animated PCB circuit traces
Hero Geometric
geometric shapes for hero sections
Matrix Rain
falling Matrix digital rain
Particle Galaxy
swirling galaxy of particles
Closing Plasma
plasma field for footer/CTA
Animated Gradient
WebGL gradient with noise
Dotted Glow Bg
dotted grid with glowing pulse
Animated Content
wrapper animates children in on mount/scroll
Antigravity
elements float up as if gravity reversed
Blob Cursor
gooey blob morphs around the cursor
Click Spark
spark burst at the click point
Crosshair
targeting crosshair tracks cursor
Cubes
grid of 3D cubes rotate on hover
Electric Border
electric glow runs along a border
Ghost Cursor
trailing ghost afterimage on cursor
Glare Hover
glossy glare sweep across a card
Gradual Blur
progressive blur gradient on an edge
Image Trail
trail of images along cursor path
Laser Flow
flowing laser-beam light streaks
Logo Loop
infinite logo marquee
Magic Rings
expanding concentric ripples
Magnet
element pulled toward cursor on proximity
Magnet Lines
grid of lines point toward cursor
Meta Balls
gooey metaballs merge/separate
Metallic Paint
liquid chrome shader on a shape
Noise
animated film-grain overlay
Orbit Images
images orbit a center in 3D
Pixel Trail
pixelated square trail on cursor
Pixel Transition
pixelated dissolve between states
Ribbons
ribbon streamers follow cursor physics
Shape Blur
blurred shape spotlight on cursor
Splash Cursor
fluid splash reacting to cursor
Star Border
sparkles travel around a border
Sticker Peel
sticker peels at corner on hover
Target Cursor
cursor snaps onto targetable elements
Following Pointer
custom label follows cursor over area
Direction Aware Hover
overlay enters from hover direction
SVG Mask Effect
cursor reveals content through a mask
Image Ripple
water-ripple distortion over an image
Infinite Image Field
endless cursor-driven photo canvas
Eye Tracking
eyes follow cursor with blink physics
WebGL Liquid
cinematic liquid shader distortion
Particle Typography
text from particles reacting to cursor
Animated List
list items animate in + highlight
Border Glow
glowing border tracks the cursor
Bounce Cards
card stack springs into a fan
Bubble Menu
menu items expand as bubbles
Card Nav
nav from expanding morphing cards
Card Swap
stacked cards 3D-shuffle to front
Carousel
sliding/3D rotating card carousel
Chroma Grid
cards with chromatic spotlight on cursor
Circular Gallery
images on a curved scrolling track
Counter
rolling-digit number counter
Decay Card
card warps/distorts toward cursor
Dock
macOS dock icons magnify on hover
Dome Gallery
images on inside of a draggable 3D dome
Elastic Slider
slider with stretchy rubber-band handle
Flowing Menu
menu marquee fill sweeps on hover
Fluid Glass
glass refraction lens over content
Flying Posters
posters fly/rotate through 3D space
Folder
folder opens to reveal cards inside
Glass Icons
glassmorphic icon buttons w/ tilt/glow
Glass Surface
frosted glass panel w/ refraction
Gooey Nav
gooey liquid blob morphs between items
Infinite Menu
3D infinite scrollable sphere menu
Lanyard
physics ID card swinging on a lanyard
Magic Bento
bento grid w/ spotlight+glow+tilt+particles
Masonry
animated reflowing masonry grid
Model Viewer
interactive 3D GLB model viewer
Pill Nav
pill nav with animated active indicator
Pixel Card
card pixel-reveal effect on hover
Profile Card
tilting holographic profile card w/ glare
Reflective Card
reflective sheen tracks cursor/tilt
Scroll Stack
cards stack/scale on scroll (sticky pile)
Spotlight Card
radial spotlight glow follows cursor
Stack
draggable Tinder-style card stack
Staggered Menu
fullscreen menu items reveal staggered
Stepper
multi-step wizard w/ animated transitions
Tilted Card
3D parallax tilt + glare on mouse move
3D Card Effect
card tilts 3D, layers lift on hover
3D Pin
map-style pin pops up in 3D
3D Marquee
tilted grid of images as a 3D marquee
Animated Modal
modal with spring scale/fade open
Animated Testimonials
stacked testimonial cards swap
Animated Tooltip
avatar tooltip springs up + tilts
Animated Tabs
tabs with sliding active pill
Apple Cards Carousel
cards expand to full content
Bento Grid
asymmetric bento feature grid
Canvas Reveal
dot-matrix canvas reveals on hover
Card Stack
auto-cycling stack of flipping cards
Comet Card
card with comet streak hover + 3D tilt
Compare
before/after slider w/ draggable divider
Container Scroll
content rotates into a device frame on scroll
Draggable Card
card dragged with throw physics
Evervault Card
hover reveals encrypted-hash matrix
Expandable Card
card expands into a modal detail
File Upload
drag-drop file upload w/ animation
Floating Dock
macOS dock icons magnify on hover
Floating Navbar
navbar hides/reveals on scroll, floats
Focus Cards
hovered card sharp, siblings blur
Glare Card
card w/ moving glossy glare
Glowing Effect
border glow tracks cursor around element
Gooey Input
input w/ gooey liquid focus
Hero Highlight
hero text w/ animated highlight + dot grid
Hero Parallax
scroll parallax wall of images
Hover Border Gradient
button animated gradient border on hover
Images Slider
fullscreen image slider w/ motion
Infinite Moving Cards
marquee of cards looping infinitely
Lamp Effect
conic lamp light glow behind heading
Layout Grid
grid cells expand to a focused layout
Lens
magnifying lens zoom over image
Link Preview
hover link → preview card popup
Macbook Scroll
macbook frame scales screen on scroll
Magnetic Button
button pulls toward cursor
Moving Border
light travels around an element border
Multi Step Loader
sequential checklist loader
Navbar Menu
animated dropdown nav w/ previews
Vanish Input
placeholder cycles; text vanishes to particles
Resizable Navbar
navbar shrinks/resizes on scroll
Sidebar
animated collapsible sidebar
Signup Form
styled animated signup form
Spotlight
spotlight beam over a hero section
Stateful Button
button morphs loading/success states
Sticky Banner
dismissible banner sticks to top
Sticky Scroll Reveal
sticky panel reveals content on scroll
Tabs
animated tab switcher
Tailwind Buttons
gallery of copy-paste button styles
Timeline
vertical scroll-animated timeline
Tracing Beam
beam traces scroll progress down page
Wobble Card
card wobbles/squishes on hover
Code Block
syntax code block w/ copy + tabs
Terminal
animated fake terminal typing output
Keyboard
visual mac keyboard component
Logo Clouds
animated grid/marquee of brand logos
Notch
iPhone-notch style UI element
Sticky Scroll Cards
card stack pins+scales while scrolling
Music Player
vinyl player w/ swinging tonearm
Scroll Split Card
card splits into 3 panels + flips on scroll
Flight Status Card
airline flight-status info card
Collection Surfer
swipeable collection browser
GitHub Calendar
GitHub contribution heatmap
Scroll Choreography
scroll-driven image choreography
Layered Stack
depth-layered cards react to hover
Signature
SVG signature draws like handwriting
Command Menu
⌘K command palette / search
Auth Modal
animated sign-in/sign-up modal
Scrub Input
drag-to-scrub numeric input
Shimmer Button
button w/ sweeping shimmer highlight
Pulsating Button
button w/ pulsing glow ring
Interactive Hover Button
button w/ layered hover animation
Showcase Card
product/feature showcase card
Testimonial Marquee
looping marquee of testimonials
Liquid Blob
morphing organic liquid blob
Premium Brand Pages / Elements · from Refero
The top 20 brand design-systems from styles.refero.design — homepage, the page style, the unique elements that set each apart, and its signature hero elements.

Linear
visit ↗“midnight command deck — acid-lime”
Dark command-deck UI. Near-black canvas, ultra-fine 1px borders, acid-lime accent, tight Inter type, subtle gradient glows.
- Pixel-crisp 1px hairline borders everywhere
- Acid-lime single-accent on pure dark
- Buttery sub-100ms hover transitions
- Gradient 'aurora' glow behind hero
- Keyboard-first ⌘K command bar
- ›Full-bleed dark hero with a faint conic glow
- ›Crisp product screenshot floating with soft shadow
- ›Single bright CTA pill

Resend
visit ↗“Obsidian developer terminal”
Obsidian-black developer aesthetic. Monospace accents, code-first hero, restrained palette, high-contrast white text.
- Code block AS the hero
- Mono + sans pairing
- Black w/ a single warm accent
- Email-send animation motif
- ›Live code snippet hero
- ›Animated send/deliver visual
- ›Terminal-style status line

Anthropic
visit ↗“Research journal on warm paper”
Warm-paper editorial. Cream/clay background, serif display headers, generous whitespace, restrained illustration.
- Cream not white background
- Serif display type
- Editorial column layout
- Soft clay accent palette
- ›Large serif headline on cream
- ›Minimal single illustration
- ›Calm low-contrast CTA

Cursor
visit ↗“Warm paper command center”
Warm-neutral dev tool. Soft off-white, rounded cards, gentle gradient hero, friendly sans.
- Warm off-white not stark white
- Rounded soft cards
- Subtle gradient hero glow
- Editor screenshot centerpiece
- ›Centered headline + editor screenshot
- ›Soft gradient backdrop
- ›Download CTA

Apple
visit ↗“Gallery wall at natural light”
Gallery-grade product showcase. Massive product imagery, huge type, scroll-driven reveals, pristine white.
- Edge-to-edge product hero imagery
- Enormous SF-Pro display type
- Scroll-pinned product reveals
- Immaculate negative space
- ›Full-bleed product shot
- ›Giant centered headline
- ›Tiny dual text-link CTAs

ElevenLabs
visit ↗“Parchment command terminal — warm”
Warm-tech audio brand. Parchment/cream + dark sections, waveform motifs, mono accents.
- Audio waveform visual motifs
- Warm parchment + dark contrast
- Voice-play inline widgets
- ›Waveform-driven hero
- ›Play-voice interactive sample
- ›Warm gradient panel

Mercury
visit ↗“Mountain-top command center”
Premium fintech. Cool gradients, glassy cards, precise grid, confident sans, soft depth shadows.
- Glassy translucent product cards
- Cool blue-violet gradient washes
- Dashboard screenshot hero
- Refined depth/shadow system
- ›Gradient sky hero
- ›Floating glass dashboard mock
- ›Single confident CTA

Vercel
visit ↗“Black-and-white precision grid”
Stark monochrome. Pure black/white, geometric, triangle motif, mono code accents, razor grid.
- Pure B&W with surgical contrast
- Triangle brand geometry
- Deploy/preview motion motifs
- Mono code typography
- ›Black hero, white headline
- ›Animated deploy graphic
- ›Dual CTA (deploy / docs)

Stripe
visit ↗“Iridescent gradient atelier”
Signature animated gradient. Multi-stop flowing gradient hero, crisp white cards, precise type, depth.
- The famous animated skewed gradient hero
- Layered API code panels
- Crisp card grid on white
- Subtle 3D depth
- ›Skewed animated gradient band
- ›Headline over gradient
- ›Live API code panel

Caldera
visit ↗“Risograph zine on warm concrete”
Risograph-zine indie. Warm concrete background, riso-print texture, bold display, off-register color.
- Risograph print texture
- Warm concrete neutral
- Off-register duotone accents
- Zine-style bold display
- ›Textured concrete hero
- ›Bold riso display headline
- ›Grainy duotone imagery

Air
visit ↗“Sky canvas, frosted glass”
Airy frosted-glass. Light sky-gradient, glassmorphic panels, soft shadows, clean sans.
- Frosted-glass panels over sky gradient
- Light airy palette
- Soft floating cards
- ›Sky-gradient hero
- ›Frosted glass product mock
- ›Light CTA

LottieFiles
visit ↗“Playful animation studio on warm”
Playful motion-first. Warm bright palette, animated illustrations everywhere, rounded friendly type.
- Lottie animations as hero content
- Bright playful palette
- Rounded friendly shapes
- Motion-everywhere
- ›Animated illustration hero
- ›Playful headline
- ›Bright CTA

shadcn/ui
visit ↗“Brutalist Swiss grid in graphite”
Graphite Swiss minimal. Neutral grayscale, mono-ish labels, crisp components, zinc palette.
- Zinc/graphite neutral system
- Component-grid showcase
- Copy-paste code-first
- Razor-clean default theme
- ›Minimal mono headline
- ›Component preview grid
- ›Two text CTAs

Steep
visit ↗“Soft dawn on a marble dashboard”
Soft-dawn data app. Pastel marble gradients, light dashboard cards, gentle pastel accents.
- Marble/pastel gradient surfaces
- Soft data-card dashboard
- Gentle pastel accents
- ›Pastel gradient hero
- ›Dashboard preview
- ›Soft CTA

Sequel
visit ↗“Blackbox gallery, lit by cinema”
Cinematic dark. Near-black, dramatic spotlighting, cinematic imagery, high-contrast type.
- Cinematic spotlight lighting
- Dramatic dark imagery
- High-contrast display type
- ›Dark cinematic hero
- ›Spotlit product/video
- ›Bright CTA

Dala
visit ↗“Particle cosmos on a void — violet”
Cosmic void. Deep-space black, violet particle fields, glowing accents, futuristic sans.
- Violet particle/starfield bg
- Glowing neon accents
- Void-black canvas
- ›Particle-cosmos hero
- ›Glowing headline
- ›Neon CTA

ORYZO AI
visit ↗“Cork coaster in a blackout studio”
Blackout studio. Pure black, warm cork/tan accent, product-render centerpiece, minimal type.
- Blackout canvas + warm tan accent
- Hero product render
- Minimal label type
- ›Blackout hero
- ›Centered product render
- ›Single tan CTA
monopo saigon
visit ↗“Cinematic darkroom, floating type”
Studio-portfolio cinematic. Dark, kinetic floating typography, full-bleed video, experimental motion.
- Kinetic floating typography
- Full-bleed video reels
- Experimental scroll motion
- Studio-portfolio bravado
- ›Full-bleed video hero
- ›Floating kinetic type
- ›Scroll-cue

Geniestudio
visit ↗“Playful pastel sky, floating shapes”
Playful pastel. Sky pastel gradient, floating 3D shapes, rounded friendly type, bright accents.
- Floating 3D pastel shapes
- Sky gradient canvas
- Rounded playful type
- ›Pastel sky hero
- ›Floating 3D shapes
- ›Bright rounded CTA

(dot)connect
visit ↗“Swiss engineering blueprint”
Blueprint Swiss. Technical grid, blueprint-blue accent, mono labels, precise diagrammatic layout.
- Blueprint grid + diagram motifs
- Technical mono labels
- Engineering-blue accent
- ›Blueprint-grid hero
- ›Diagrammatic product mock
- ›Precise CTA