UI kit

shadcn/ui's component vocabulary, rebuilt as Astro components and themed with the RippleCore design system. No React, no client-side JavaScript.

Button

as a link

Badge

defaultsecondaryaccentoutlinesparkdestructive

Card

With a header

Title and description via props.

The body is the default slot. Header and footer collapse when unused.

With a footer

Footer content comes from the named footer slot.

Alert

default alert

Status colours come from the design system's tint and -fg pairs.

info alert

Status colours come from the design system's tint and -fg pairs.

success alert

Status colours come from the design system's tint and -fg pairs.

warning alert

Status colours come from the design system's tint and -fg pairs.

destructive alert

Status colours come from the design system's tint and -fg pairs.

Separator

Horizontal, then vertical.

Left
Right