TetraKits UI Glass Feature Card ← Library

Glass Feature Card

Glassmorphism feature card with backdrop-blur, white/10 border, icon slot, title, and description. Dark-mode SaaS feature grid tile. Copy into React landing pages for AI tools, analytics, and dev platforms.

glassmorphism cardfeature card reactbackdrop blursaas featuresdark ui card
Live preview

Dependencies

react
npm install react react-dom
export function GlassFeatureCard() {
  return (
    <div className="rounded-2xl border border-white/10 bg-white/5 p-6 backdrop-blur-xl">
      <div className="flex h-10 w-10 items-center justify-center rounded-xl bg-indigo-500/20 text-indigo-300">⚡</div>
      <h3 className="mt-4 font-semibold text-white">Lightning fast</h3>
      <p className="mt-2 text-sm text-zinc-400">Optimized bundles under 4kb gzipped per component.</p>
    </div>
  );
}