Link
@xui/linkA styled anchor.
Install
pnpm add @xui/link Add the barrel to a standalone component's imports:
import { XuiLinkImports } from '@xui/link';@Component({ imports: [XuiLinkImports], // …})Examples
Default
Loading preview…
<a xuiLink href="https://xuijs.org" color="link" underline="always">Documentation</a>Underline
Loading preview…
<div class="flex flex-col items-start gap-2"> <a xuiLink underline="always" >always</a> <a xuiLink underline="hover" >hover</a> <a xuiLink underline="none" >none</a></div>In running text
Loading preview…
<p class="text-foreground-muted max-w-prose"> Every component styles itself with semantic utilities that resolve through the <a xuiLink color="inherit" underline="hover" href="https://xuijs.org">token layer</a>, so switching theme re-colours the whole page without a rebuild.</p>API
A styled anchor.
Variants
underlinealwayscolorlinkInputs
classClassValueThe user-defined classes. Merged last so they win over the variant classes.''colorXuiLinkVariants['color']Link colour. current follows the surrounding text — for links inside body copy that should not break the line's colour.this.config.colorunderlineXuiLinkVariants['underline']When to underline: always, only on hover, or none. Prefer always for links inside prose, where the underline is the only thing marking them.this.config.underline