A feature/benefit card with an index, a tinted radial glow, a central illustration that idle-floats and pops on hover, and a frosted content plate with a color-tinted tag. Five color palettes, ships with original SVG glyphs, light & dark.
React
TypeScript
framer-motion
A polished feature/benefit card for landing pages and product tours. It shows a monospace index, a tinted radial wash and a pulsing glow behind a central illustration that idle-floats and pops forward on hover, and a frosted glass content plate with a color-tinted tag and title. The whole card lifts on hover. Five color palettes (orange, purple, blue, emerald, rose), each with a matching built-in SVG glyph so it works out of the box — or pass your own image/node. Self-contained (injects its own CSS, no Tailwind required), light & dark, React 19 + TypeScript strict, reduced-motion aware. Requires framer-motion.
A premium hire-a-freelancer card: banner with soft zoom, avatar with online dot, half-star rating, meta chips, a tools row and a glossy "Get in touch" CTA. Self-contained CSS, light & dark, fully accessible.
React
TypeScript
lucide-react
A polished profile card for marketplaces and portfolios. It shows a tinted banner that gently zooms on hover, an avatar with an online indicator and ring, a real half-star rating, meta chips (rating, duration, rate), a tools row, a bookmark toggle that fills when saved, and a primary call-to-action. The whole card lifts on hover. Ships as a single self-contained file (injects its own CSS, no Tailwind required), works in light or dark, and is built React 19 + TypeScript strict with accessible, reduced-motion-aware interactions.
A media-frame grid where hovering a frame expands its row and column (the whole grid reflows smoothly) and tilts that single card in 3D toward the cursor with a glare. Bring your own clips/images. Framer Motion.
React 19
React
TypeScript
Dynamic Frame Layout is an interactive grid of media frames. Hovering a frame expands its row and column — the whole grid re-flows smoothly via framer-motion — while that single card tilts in 3D toward the cursor with a moving glare. Other cards stay flat.
Each frame's media can be a video URL, image URL, or any React node; the built-in defaults are original animated gradient tiles (no third-party assets bundled), so it looks great before you add content. Configurable columns, gap and hover-expand amount. Self-contained CSS, accessible focus support, prefers-reduced-motion friendly. React 19 + TypeScript. Requires framer-motion. Original work for Assetzaar.
A premium 3D hero card: a floating Three.js character that follows the cursor — or drop in any Spline/GLB scene — beside a glass spotlight and your copy. Self-contained, accessible, reduced-motion aware.
React 19
React
TypeScript
Scene 3D is an interactive 3D hero for React 19 and TypeScript. Out of the box it renders an original Three.js character — a floating bot whose head and glowing eyes follow the cursor — next to a glass spotlight and your headline. It is the dependency-light way to add real, immersive 3D to a hero without wrestling a 3D pipeline.
Bring your own scene in two ways: set a Spline URL and it lazy-loads @splinetool/react-spline (and its runtime) only when used; or pass a .glb/.gltf model URL for the Three.js stage, with optional cursor-tracking pupils that work on any model (rigged or not) plus named-eye rotation for rigged characters. If a model fails to load it gracefully falls back to the built-in bot.
Self-contained CSS (injected once, no Tailwind), accessible copy, and prefers-reduced-motion aware (it calms the float/animation). Original work for Assetzaar. Core install needs three; add @splinetool/react-spline only if you use a Spline scene.
An interactive team gallery: the panel under the pointer or keyboard focus expands while the others compress into vertical name tags, revealing role and social links. Pure-CSS magnify, accessible, self-contained.
React 19
React
TypeScript
Lineup is an interactive "bento" team gallery for React 19 and TypeScript. The panel under the pointer — or keyboard focus — smoothly expands while the others compress into slim columns with vertical name tags; the expanded panel reveals the person's name, role and social links, and the photo zooms subtly.
The magnify is pure CSS (no JS measuring), so it stays buttery and works on focus-within for keyboard users. It is fully self-contained: it injects its own CSS and a system font once on mount, ships with graceful avatar fallbacks (a generated gradient when a photo fails), respects prefers-reduced-motion, and is light by default with an optional dark theme. On small screens it stacks into expandable rows.
Drop in your own members (name, role, photo, socials) or use the bundled placeholders. Icons via lucide-react. Original work for Assetzaar.
A 3D card that tilts toward the cursor and casts a soft "comet" glare that follows the pointer across its surface. Wrap any content; zero dependencies, reduced-motion aware. Composable CometCard wrapper + a ready-made invite demo.
An interactive 3D card that tilts toward your cursor with CSS perspective, while inner items lift on the Z axis (translateZ) for real depth. Zero dependencies, dark mode, and tilt disabled under reduced-motion. Composable CardContainer / CardBody / CardItem API.
A premium "cutout corner" brand/feature card with an autoplaying muted looping video media band, a notched inset label, a corner badge, a 2x2 feature grid and a CTA. Drop-in, dark-mode and reduced-motion friendly, lucide-react only.
A premium frosted-glass article card with an animated orbiting gradient border, serif display headline, dark mode and full WCAG AA accessibility — drop-in, zero required props.
React
React 19
TypeScript
Aurora Glass Card is a single-file React 19 + Tailwind component: a luxury glassmorphism article/blog card with an animated conic-gradient border that orbits the edge and intensifies on hover and keyboard focus. Fully themeable via CSS variable tokens, accessible by construction (stretched-link pattern, visible focus ring, aria-pressed save, prefers-reduced-motion), with graceful image and avatar fallbacks and a refined serif headline. Zero required props — drop it in and it renders beautiful defaults.
