Get startedFoundationsPatternsComponentsTokensContentGet support
Select your development framework to see all code in your development languages. You can change this in the top right of the screen.Support for the Long Term Support (LTS) version of the Design system will be available until September 2025. View the upgrade guide
AllAccordionCalloutContainerDetailsHero bannerListPopoverTableTextBadgeFilter chipModalNotification bannerProgress indicatorSkeleton loaderTooltipButtonButton groupCheckboxDate pickerDropdownFile uploaderIcon buttonInputRadioText areaDrawer FooterForm stepperHeaderMicrosite headerPaginationSide menuTabsBlockDividerForm itemGridIconsLinkSpacer
TableGitHub issuesFigmaA set of structured data that is easy for a user to scan, examine, and compare.Related:Button, Dropdown, Filter chip, Pagination, Tabs
Code playground
StatusTextNumberAction
Lorem ipsum1234567890Action
Lorem ipsum1234567890Action
Lorem ipsum1234567890Action
Lorem ipsum1234567890Action
Properties
Examples

Sort data in a table

First nameLast nameAge

Display numbers in a table so they can be scanned easily

Col 1Col 2Number Column
Item 1Item 254
Item 1Item 24567

Filter data in a table

Filter
StatusNameID Number
Ivan Schmidt7838576954
Luz Lakin8576953364
Keith McGlynn9846041345
Melody Frami7385256175
Frederick Skiles5807570418
Dana Pfannerstill5736306857
Design
Detailed design documentation for this component can be found on its component page in Figma.
Accessibility
Accessibility documentation for this component can be found on its component page in Figma. More accessibility guidance for design and development is coming soon.
Join design system drop in hours to get feedback on your service, propose new components or patterns, suggest changes to existing resources, ask questions, and give feedback to the design system. These sessions are for Government of Alberta product teams.
Book time in drop in hours
Get startedPatternsComponentsDesign tokensContentSubmit an issue#design-system-supportContribute to the design systemRoadmapRelease notes