Logo
Optimized Raft mark, wordmark, and combined lockup SVGs.
Decorative mark beside visible brand text
import { RaftLogo, RaftLogoLockup, RaftWordmark } from "raft-ui";
<RaftLogo role="img" aria-label="Raft" />
<RaftWordmark role="img" aria-label="Raft" />
<RaftLogoLockup role="img" aria-label="Raft" />Give a standalone brand graphic an accessible name. When visible text already names the brand, hide the repeated SVG from assistive technology.
<RaftLogo role="img" aria-label="Raft" />
<div>
<RaftLogo aria-hidden />
<span>Raft</span>
</div>...propsComponentPropsWithoutRef<"svg">
Standalone Raft mark. Size it with native SVG props or className.
| Prop | Type | Default | Description |
|---|---|---|---|
...props | ComponentPropsWithoutRef<"svg"> | — | Standalone Raft mark. Size it with native SVG props or className. |
...propsComponentPropsWithoutRef<"svg">
Standalone Raft wordmark with its own fitted viewBox.
| Prop | Type | Default | Description |
|---|---|---|---|
...props | ComponentPropsWithoutRef<"svg"> | — | Standalone Raft wordmark with its own fitted viewBox. |
...propsComponentPropsWithoutRef<"svg">
Combined mark and wordmark lockup in one SVG.
| Prop | Type | Default | Description |
|---|---|---|---|
...props | ComponentPropsWithoutRef<"svg"> | — | Combined mark and wordmark lockup in one SVG. |