Skip to content
SkillCodex
Menu

Concept cluster

Structure and explore data

Compare static tabular reading, cell-by-cell interaction, and expandable hierarchical navigation.

Try the 3 concepts, compare what changes, then use the Pack that fits your need.

Try the components

Structure and explore data

Try it

Should people read tabular data, interact cell by cell, or expand a hierarchy?

Table

Shared trial context

A workspace presents a large information set whose structure and interaction model determine how people scan, edit, or expand it.

Table

Mission

Table

Sort Name ascending and then descending while confirming focus and header context remain intact.

Release candidate metrics
StatusOwner
BeaconReviewLéo
AtlasReadyAmina
CometDraftMarta

Live result

The table follows source order; its cells remain in document reading order.

Step 1 of 3

Try

Try the component. Your live result appears just above. Move on at your own pace.

Behavior and edge case
What to observe
Source order is shown with a caption and correctly scoped headers.
Edge case
Long values use horizontal overflow without converting rows into inaccessible cards or breaking header associations.

What this example shows

Table is read as document content and its cells are not focus-managed; Data grid is a composite widget with arrow-key cell navigation, while Tree view organizes hierarchical nodes.

Use the Pack — Table

Which fits your need?

Table

People compare values across rows and columns

Data grid

Large tabular data needs efficient keyboard navigation

Which component will you use here?
Read the full PackVerify the result
Difference and sources

Table is read as document content and its cells are not focus-managed; Data grid is a composite widget with arrow-key cell navigation, while Tree view organizes hierarchical nodes.

Read the sources

    Parts of the specimen

    Select a numbered marker on the schematic, or use the list below, to see its role. The schematic shows the concept's representative state.

    Table

    The tabular container that preserves row and column relationships.

    The three concepts

    ConceptTableA non-widget tabular structure that relates static data through rows, columns, and their headers.OpenConceptData gridAn interactive tabular composite that manages one keyboard entry point and directional focus among cells, often adding editing or selection.OpenConceptTree viewA composite widget for navigating hierarchical items whose parent nodes can expand or collapse their child groups.Open

    The three comparisons

    ComparisonData grid vs TableComparisonTable vs Tree viewComparisonData grid vs Tree view

    Signals you are confusing them

    These descriptions fit every concept in the cluster, so none of them is enough to decide.

    • show many related records in a compact structured view
    • the information may be read as a table operated as a grid or expanded as a hierarchy

    Other concept clusters

    Concept clusterMotion & EffectsConcept clusterSmall contextual surfacesConcept clusterModal surfacesConcept clusterEdge-attached surfacesConcept clusterChoose from a listConcept clusterChoices and binary statesConcept clusterChange view or reveal contentConcept clusterInform the userConcept clusterWait and track progressConcept clusterTrigger or navigateConcept clusterEnter textConcept clusterOrient within a journey