Anchor
A styled <a> element with theme-aware color and configurable underline behavior. Use underline to control when the decoration is visible, and c to override the link color.
Default
<Anchor href="#">Default anchor link</Anchor>Underline
<Anchor href="#" underline="always">always</Anchor>
<Anchor href="#" underline="hover">hover (default)</Anchor>
<Anchor href="#" underline="never">never</Anchor>Color
<Anchor href="#" c="violet">violet</Anchor>
<Anchor href="#" c="blue">blue</Anchor>
<Anchor href="#" c="green">green</Anchor>
<Anchor href="#" c="red">red</Anchor>Size
<Anchor href="#" size="xs">Extra small</Anchor>
<Anchor href="#" size="sm">Small</Anchor>
<Anchor href="#" size="md">Medium</Anchor>
<Anchor href="#" size="lg">Large</Anchor>
<Anchor href="#" size="xl">Extra large</Anchor>Open in new tab
<Anchor href="https://davaux.dev" target="_blank" rel="noopener noreferrer">
Opens in new tab
</Anchor>Props
| Prop | Type | Default | Description |
|---|---|---|---|
href | string | — | URL the link navigates to |
underline | 'always'|'hover'|'never' | 'hover' | When the underline decoration is shown |
c | string | — | Link color — theme key or CSS value |
size | 'xs'|'sm'|'md'|'lg'|'xl'|string | — | Font size |
target | string | — | Browsing context (e.g. '_blank') |
rel | string | — | Link relationship (e.g. 'noopener noreferrer') |