Surfaces

GlassCard

Backdrop-filter: ambition.

Glassmorphism feature card. Compound parts let you rearrange or swap sections. `breathing` toggles a slow box-shadow pulse; `glowOnHover` reveals a gradient halo on hover.

Install

Copy this owned-code component into your app from the registry.

pnpm dlx shadcn-svelte@latest add https://benjamin-brady.github.io/performative-ui-svelte/registry/glass-card.json

Examples

Default with all parts
✦

Reason

A frontier-class reasoning engine. Multi-step. Multi-modal. Multi-vendor.

Learn more →
<GlassCard breathing>
  <GlassCard.Icon>✦</GlassCard.Icon>
  <GlassCard.Title>Reason</GlassCard.Title>
  <GlassCard.Body>A frontier-class reasoning engine.</GlassCard.Body>
  <GlassCard.Link href="/learn">Learn more</GlassCard.Link>
</GlassCard>

Props

PropTypeDefaultDescription
breathingboolean-Slow shadow pulse.
glowOnHoverbooleantrueGradient halo on hover.
GlassCard.Icon
GlassCard.Title
GlassCard.Body
GlassCard.Link
PropTypeDefaultDescription
hrefstring-Anchor target.
Next MockIDE ] →