Components
Add-link tile
A dashed tile provides creation directly in the bookmark grid and empty state.
On this page
Purpose and placement
A dashed tile provides creation directly in the bookmark grid and empty state.
Anatomy
- Dashed 64px square
- Plus glyph
- Add New label where populated
Contract
| Input or boundary | Behavior |
|---|---|
| Click | Reset link form and open create editor |
| Empty-board variant | Named Add new link icon button |
States and feedback
- Alongside existing bookmarks
- Single empty-state action
- Hover lift
Interaction and composition
Use the tile after saved bookmarks, keeping its visual language lighter than the saved accent squares. The header Add New menu is a second entry point to the same editor, not a separate workflow.
Responsive behavior
Matches bookmark dimensions and occupies the same auto-fit grid.
Accessibility contract
The empty-state action has an explicit aria-label. The grid version derives its name from Add New text. Both are native buttons.
Known implementation gaps
Dashed border and faint label contrast vary by theme. Include these alpha surfaces in a broader accessibility review.
Source references
| Repository file | Responsibility |
|---|---|
| app/(home)/AppHome.tsx | Populated and empty add controls |
Examples from the app
Actual Startboard source UI with isolated fictional records; both native themes at 2× resolution or higher. No live integrations or account writes. Captured at 2× resolution or higher. Select an image to inspect it full size.
Related topics
Source audit: 2026-10-08 · Revision 08fa2595a668 · Documentation v1.0.0