'/%3e%3cg%20transform='translate(170%20205)%20scale(0.3606)'%20fill='%23111011'%3e%3cpath%20d='M497%20640H359L248%20320%20122%20640H0L256%200z'/%3e%3cpath%20d='M292.43%20640H200.8L248%20522z'/%3e%3cpath%20d='M335%200h138l111%20320L710%200h122L576%20640z'/%3e%3c/g%3e%3c/svg%3e){kind=small}
Extras
Watermark
A faint repeated text over content: drafts and confidential previews.
Ant Design: Watermark
import { Watermark } from '@alea/ui';
Examples
Watermark
Over any content; decorative only.
Q4 roadmap
Plugins in the store, Alea phase 3, the icon kit.
Props
Watermark props
Repeats a faint text over content: drafts, confidential previews (Ant's Watermark). Decorative: hidden from screen readers, not a security measure.
| Prop | Type | Default | Description |
|---|---|---|---|
textrequired | string | - | The text repeated across the area. |
className | string | - | Extra class names for the root element. |
gap | number | 120 | Gap between marks in px. Default 120. |
opacity | number | 0.08 | 0 to 1. Default 0.08. |
rotate | number | - | Angle in degrees. Default -22. |
Accessibility
- Decorative and hidden from screen readers: say "Draft" in the page too if it matters.
Do and don't
Do
- Say it in words too when it matters (Draft, Confidential).
- Keep it faint so the content stays readable.
Don't
- Don't rely on it for security.
- Don't cover interactive controls with it.