ClickorAltL

Dragto resize

Nord Design System SearchDeveloperDeveloperGetting startedUsing Web ComponentsWebfontsCDNLocalizationCSS Framework Legacy ESLint PluginWorking with AIFAQDesignDesignGetting startedFoundationsThemesBrand assetsToolsComponentsComponentsAccordion New Aside New Autocomplete New AvatarBadgeBanner Updated ButtonButton GroupCalendar Updated CardCheckbox Updated Collapsible New Combobox New Command MenuDate Picker Updated Date Range Picker New DividerDrawerDropdownEmpty StateField New FieldsetFilter Bar New FooterHeaderIconInput Updated Item New Kbd New LayoutMessageMeter New ModalNavigationNotificationNumber Field New Otp Field New Outline New Pagination New Popout Updated ProgressProgress BarQrcodeRadio Updated Range Updated Scroll Area New Segmented ControlSelect Updated SkeletonSpinnerStackTabTableTagTextarea Updated Time Picker New ToastToggle Updated TooltipTop BarTruncate New Visually HiddenDesign TokensDesign TokensTailwind CSSTailwind CSSBlocksBlocksTemplatesTemplatesIconsIconsPlaygroundPlaygroundLatest UpdatesLatest UpdatesChangelogChangelogMigration guidesMigration guides
GitHub

The design system behind Nordhealth's products

Production-grade web components, tokens, and guidelines — the same parts our teams use to ship clinical software every day.

Works with any framework
Rendered live with Nord web components — inspect away

Find any component in a keystroke

Search 57 components and 300 icons. Open the command palette to jump straight to any of them.

Browse all →

Start in minutes

Install from npm or load straight from the CDN. Components work in plain HTML, React, Vue, or any framework.