Web components
Custom elements built with Lit. They work in plain HTML and in React, Vue, Svelte, Astro, or anything else that renders HTML. Each one reads the --hc- tokens, so it follows light and dark mode automatically.
Core
Button
<hc-button>
Card
<hc-card>
Badge
<hc-badge>
Input
<hc-input>
Email signup
<hc-email-signup>
Heading, kicker & gradient text
<hc-heading> <hc-kicker> <hc-gradient-text>
Container & section
<hc-container> <hc-section>
Icon
<hc-icon>
Site chrome
Navigation
<hc-nav> <hc-nav-menu>
Footer
<hc-footer> <hc-footer-column>
Theme toggle
<hc-theme-toggle>
Motifs
Polaroid & sticker
<hc-polaroid> <hc-sticker>
Wave & grid paper
<hc-wave> <hc-grid-paper>
Content
Prose
<hc-prose>
Callout
<hc-callout>
Code block
<hc-code>