Skip to content
Social Card
··· ··· ···
··· ··· ···
··· ··· ···
··· ··· ···
Customize
Reset
Layout
Stack
Grid
Direction
left
center
right
Card size
120px
pnpm
pnpm dlx shadcn@latest add https://blocks.ricoui.com/r/social-card.json
Components
Display
Magnifier
Contribution Graph
Empty States
Kubai Empty States
Social Card
Dither Pop
GitHub Repo
Dither Progress
Flip Switch
File Organizer
Buttons
Bell Button
Button
Backgrounds
ASCII Background
Preloader
Popin Preloader
Clip Image Preloader
Step Overlap Preloader
Esc
Pages
Home
An independent collection of thoughtful React components.
All components
Explore the collection. Preview, customize, and copy.
Templates
Astro website templates for portfolios, products, and personal projects.
Brand assets
Download RicoUI logos and artwork as PNG files.
Components
GitHub Repo
A tactile repository card with a blue clasp, vector Octocat badge, warm halftone star button, and layered contact shadows.
Bell Button
A notification button with a bell, optional count badge, and the beveled light and dark finishes of RicoUI Button.
Button
A native button in the RicoUI palette, with light and dark themes, six variants, and built-in loading and disabled states.
Dither Progress
A horizontal Dither Pop progress bar with a blue capsule, lightning badge and warm halftone fill that grows denser as progress advances.
Flip Switch
A horizontal Dither Pop rocker switch with a blue housing, warm two-tone paddle and fine halftone details.
Magnifier
A precision optical magnifier with a projected metal housing, inertial drag and a curved magnifying lens.
File Organizer
A colorful desktop file box with layered folders, crisp halftone surfaces and a staggered opening sequence.
Contribution Graph
A five-level blue contribution heatmap with ASCII details and an interactive canvas companion.
Empty States
Twelve precision-crafted empty states with porcelain surfaces, recessed panels, chamfered frames and engraved details. Original SVG scenes with layered mechanical animation.
Kubai Empty States
Twelve miniature product interfaces for empty, unavailable, and failed states. Self-contained SVG with light, dark, and system themes.
Popin Preloader
A pale blue-gray loading screen with a brand-blue sweep, elastic Ready letters, and an upward curtain exit.
Clip Image Preloader
A logo and counter lead into seven clipped photographs, arranged as a responsive montage, then darkened and lifted away.
Step Overlap Preloader
A softly blurred letter entrance and corner counter, followed by white, pale blue, and brand-blue curtains that lift in sequence.
Social Card
A stack of social links with luminous gradients, blurred color, and fine grain. Hover or focus to spread the centered cards in both directions; touch devices show an open grid. Includes a standalone HTML version.
ASCII Background
Blue ASCII currents drift across light and dark canvases, with ripples that follow your pointer. Available as a React component or a standalone HTML file.
@author
@author
@author
@author
@author