DocsComponentsComponents overview
Updated: September 14, 2026 Eighty components is a lot to scroll past alphabetically. This groups them by
the job they do, so you can find the one you need without knowing its name.
If you are new, start with Structure — layout is the part
everything else sits inside.
The primitives, and the containers built from them.
- Flex — the layout primitive; one axis, and every shared prop
- Grid — two-dimensional layout with a responsive column count
- MasonryGrid — columns for items of uneven height
- SplitView — two resizable panes, collapsing to tabs when narrow
- Line — a rule, horizontal or vertical
- Mask — reveal content through a shape or cursor-following window
Things that hold other things.
- Card — a surface that can be selected or clicked
- Background — gradients, dots, grids and lines behind a section
- Fade — an edge that dissolves into the surface behind it
- Banner — a full-width strip for an announcement
- Book — a 3D cover, for showing a publication
- Heading — headings on the type scale
- Text — everything else on the type scale
- BlockQuote — a pulled quote
- InlineCode — code inside a sentence
- Kbd — a key or shortcut
- List — ordered and unordered lists
- Table — sortable, selectable, paginated rows
- Timeline — events in order
- Media — images and video, with the framework's optimizer when there is one
- MediaPlayers — audio and video with real controls
- CompareImage — two images under a draggable divider
- Logo / LogoCloud — a mark, and a grid of them
- OgCard — a link rendered as its own preview
See Effects for the ambient layers — blobs, matrix, weather,
glitch, holo and the rest.
Components with no UI of their own.
- Form controls — inputs, selects, pickers, toggles
- Data — charts and gauges
- Effects — ambient and text effects
- Modules — CodeBlock, MediaUpload, MegaMenu, Meta, Schema
