HomeNewsletterContentShop
Home
Newsletter
Content
Shop
Radio MD
Playground
Stack
NFTs

System

A comprehensive guide to the design system, including typography, components, form elements, and patterns used throughout the site.

Navigation

  • Palette
  • Typography
  • Buttons
  • Form Elements
  • Badges
  • Cards
  • Alert Dialog
  • Newsletter
  • Spacing

Variants

Sizes

With Icons

Outline Sizes

Ghost Sizes

As Links (asChild)

Default LinkOutline LinkGhost LinkText Link

States

Loading State

Click any button to see the loading state (2 seconds)

Destructive

For delete/remove actions. Default state uses subtle destructive background, hover shows outline.

Ghost Icon Variants

Subtle icon buttons with 50% opacity, colored hover states. Use ghost-destructive for close/delete, ghost-secondary for neutral actions.

Text Button Hover Colors

Use the textHover prop to control hover color. Defaults to accent.

Copyright © 2026. All rights reserved.

Privacy Policy•FAQ•
HomeNewsletterContentShop
Radio MDSystemPlaygroundStackNFTs
HomeNewsletterContentShop
Radio MDSystemPlaygroundStackNFTs

Copyright © 2026. All rights reserved.

Privacy Policy•FAQ•