Digram, Item types
Updated 2026-05-19
Confidence anatomy low variants medium motion medium a11y high content low
Overview
Section titled “Overview”Works like tags but contains only 2 letters (initials of category name)
Anatomy
- 1 Containerthe bounding surface — frames the data presentation
- 2 Title or heading (optional)identifies what the data represents
- 3 Primary contentthe data itself — text, value, chart, table cells, badge label
- 4 Supporting metadata (optional)timestamps, units, counts, attribution
- 5 Visual indicator (optional)color dot, icon, badge, or status pill
- 6 Action affordance (optional)expand, drill-in, dismiss, or copy
Variants
Default | Large |
|
|---|---|---|
Dataset | ||
Data process | ||
Data product | ||
Field | ||
Output port | ||
Use case | ||
Visualization | ||
Category | ||
Custom 1 | ||
Custom 2 | ||
Custom 3 | ||
Custom 4 | ||
Custom 5 | ||
Custom 6 | ||
Custom 7 | ||
Custom 8 | ||
Custom 9 | ||
Custom 10 | ||
Custom 11 | ||
Custom 12 | ||
Custom 13 | ||
Custom 14 | ||
Custom 16 | ||
Glossary 1 | ||
Glossary 2 | ||
Glossary 3 | ||
Glossary 4 | ||
Glossary 5 |
Motion
Skeleton Loading
rows/cards reveal with skeleton placeholders during load
Staggered Entrance — Lists, Table Rows, Search Cards
lists, tables, search-result-cards enter with staggered fades
Accordion (expand/collapse)
Slug: accordion-expand-collapse
collapsible cards/sections expand at the accordion pace