ClickorKeyboard shortcut Alt + L

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 Performance FixturePopout 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

Clickto expandKeyboard shortcut Alt + L

February, 2021

You’re reading the first ever Nord Design System monthly update. We’re just starting our design systems journey at Nordhealth and have created this documentation platform to support these efforts.

The aim of this platform is to serve as a hub for Nordhealth’s user interface design and frontend development work in the future. We’re pushing towards automating most parts of the documentation creation, but you should also expect to see manually crafted design guidelines, development tutorials, and similar here in the future.

To stay up to date with the latest releases and updates from our design systems team, you can follow the what’s new section that includes our current roadmap and any future updates we might release.

Currently, our main focus has been on brand refresh, exploring the overall visual direction, how the theming system works, and also creating the underlying technical architecture to support the work that follows.

Our draft style guide looks like this:

Provet style guideDiarium style guide

We’ve also started exploring components a little and how they could behave and look like. Here’s a concept on navigation that we’ve also tested on the documentation itself:

Navigation component concept

Last week, we also published the very first production ready design systems package, Nord Webfonts, which includes our UI typefaces and related tools to utilize them:

Nord Webfonts 1.0.1

  • Initial release of @nordhealth/fonts which includes Nordhealth Sans and Nordhealth Mono. For documentation and usage guidelines, please see Webfonts.
  • Makes @nordhealth/fonts package completely independent from @nordhealth/tokens.
  • Can now be used standalone without any other package from Nord.
  • Release date 11.2.2021.

We’ve also started drafting Nord Design Tokens which you can browse here. The early token views are shown below:

Provet Design TokensDiarium Design Tokens

If you liked this update, please consider subscribing to our RSS Feed to follow the latest updates from Nord team.

P.S. Our team is hiring, view open positions to apply.

Until the next time! — Ariel