Components
Scroller
A bounded scroll region with a styled scrollbar.
Default
- v1.4.2 Hinting pass for 11px rendering
- v1.4.1 Fix kerning around backtick pairs
- v1.4.0 Box-drawing set snapped to the grid
- v1.3.3 mrkdwn export keeps footnote order
- v1.3.2 Zero gains a dotted variant
- v1.3.1 Ligature substitutes for arrows
- v1.3.0 Variable weight axis 100–800
- v1.2.4 Cyrillic extension, 120 glyphs
- v1.2.3 Fix vertical metrics on Linux
- v1.2.2 Code theme tokens for diff views
- v1.2.1 Tabular figures by default
- v1.2.0 618-unit cell locked in
- v1.1.1 Punctuation weight rebalanced
- v1.1.0 First markdown theme presets
- v1.0.0 Initial release
<div class="max-h-48 overflow-y-auto rounded-xl border border-separator bg-bg-surface">
<ul class="divide-y divide-separator">
<li class="px-4 py-2.5 text-sm">…</li>
</ul>
</div>Horizontal
v1.4.2
v1.4.1
v1.4.0
v1.3.3
v1.3.2
v1.3.1
v1.3.0
v1.2.4
v1.2.3
v1.2.2
v1.2.1
v1.2.0
v1.1.1
v1.1.0
v1.0.0
Horizontal scrolling (overflow="x") for chip
and tile rails — content is wider than the track. The shadcn ScrollArea horizontal variant
is the same pattern with a styled scrollbar.
<div class="overflow-x-auto">
<div class="flex w-max gap-2">
{chips.map((c) => <span class="shrink-0 …">{c}</span>)}
</div>
</div>With buttons
v1.4.2
v1.4.1
v1.4.0
v1.3.3
v1.3.2
v1.3.1
v1.3.0
v1.2.4
v1.2.3
v1.2.2
v1.2.1
v1.2.0
v1.1.1
v1.1.0
v1.0.0
Horizontal with buttons adds withButtons, which
scroll to the next direct child. Vertical with buttons is the same with
overflow="y". Free
(overflow="both") scrolls on both axes — reserved for content
like logs with very long lines.
Markdown for agents: /design/scroller.md · spec: /design.md