Creators may embed this optional badge in a repository or project page. It points directly to this product; no backlink is required, and the supplied link is nofollow by default.
Related products
More production-ready assets in the same category.
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 animated-gradient button with a bright light orbiting the edge, four variants, five sizes, loading/disabled states and an under-glow — self-installing keyframes (no tailwind.config edits), accessible, zero required props.
React
React 19
TypeScript
Aurora Button is a premium animated-gradient button for React 19 + TypeScript + Tailwind CSS. A bright light orbits the edge over an elevated surface (CSS transform animation — visible in every browser and on any background). Self-installing: it injects its own keyframes once on mount, so there are no tailwind.config or global CSS edits. Palette via --ab-1…--ab-5 tokens with premium defaults; rebrand any button inline. Four variants (gradient / inverted / outline / solid / ghost) and five sizes including icon. Built-in loading state with spinner + aria-busy, disabled, focus-visible ring and active press; asChild (Radix Slot) renders it as a link; prefers-reduced-motion pauses all motion. Strict TypeScript, accessible (WCAG AA).
A premium split sign-in card (form + cover image) with a light orbiting the outside edge, password reveal, social providers, dark mode and WCAG AA — drop-in, framework-agnostic, zero required props.
React
React 19
TypeScript
Aurora Sign-In Card is a premium, framework-agnostic split login/sign-in card for React 19 + TypeScript + Tailwind CSS. A subtle light orbits the outside edge (CSS transform animation — visible in every browser), the body stays opaque so nothing bleeds inside, and the gradient submit button has a sweeping sheen on hover. Includes a password show/hide toggle, remember-me, forgot-password, and a swappable social-provider row (GitHub / email link / passkey). Real form semantics with stable field names work with any auth SDK or server action. Fully tokenised via CSS variables, dark by default and light-ready, accessible (labelled fields, visible focus, prefers-reduced-motion). No next/image and no brand-logo SVGs — original and license-clean. Single file, default export, lucide-react the only dependency.
Lineup — Expanding Bento Team Gallery for React (CSS magnify, self-contained)
React 19
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.
What is this component?
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.