Typography

Stable

Text components with standard sizing and special cyberpunk effects.

Examples

Headings

SYSTEM OVERRIDE

Initialize Sequence

Network Status

tsx

<div className="flex flex-col gap-4">
  <Heading as="h1">SYSTEM OVERRIDE</Heading>
  <Heading as="h2">Initialize Sequence</Heading>
  <Heading as="h3">Network Status</Heading>
</div>

Paragraphs

The system has detected an anomaly in sector 7G. Please verify security protocols.

tsx

<Text as="p">
  The system has detected an anomaly in sector 7G. 
  Please verify security protocols.
</Text>

Glitch Effect

Add a dynamic cyberpunk glitch effect to important text elements.

CRITICAL FAILURE

tsx

<GlitchText text="CRITICAL FAILURE" />

API Reference

Property	Description	Type	Default
as	The heading level or text element.	"h1" \| "h2" \| "h3" \| "h4" \| "p" \| "span"	-