Latest Releases
Nord Design System’s parts are versioned and released using Node Package Manager. NPM’s organization page lists all packages available and their most recent versions.
Design Tokens
8.0.0New
- New major release that unifies the two design system platforms into a one platform that can serve all of Nordhealth. This change allows us to better support the next generation of apps and generative AI experiences at Nordhealth. ✨
- This new version ships with two distinctive brands, therapy and veterinary. You can choose the currently active brand from the top left corner of this documentation website. Once chosen, you will get content that is tailored specifically for the brand and the business unit you’re working in. Read more.
- The Design Tokens package now includes veterinary brand colors.
- This release doesn’t include breaking changes for the existing users of Nord Design System.
- For detailed description of all changes and the steps required for migration, please see the Migration Guide.
- See also the updated brand theme guidelines in the Design Tokens documentation page.
- Release date 6.5.2025.
7.1.2
- Migrates the monorepo to use pnpm workspaces instead.
- Release date 24.9.2024.
7.1.1
- Updates readme document details.
- Release date 14.6.2024.
7.1.0
- Adds new
var(--n-size-top-bar)
sizing token that is used for setting the default height of the Top Bar component. - Release date 11.4.2024.
7.0.1
- Improves
var(--n-color-nav-hover)
to be more consistent with other colors in the light high contrast theme. - Release date 31.5.2023.
7.0.0
- New major release that brings various improvements and bug fixes!! ✨🥳
- We’ve improved the underlying color system to make it more extensible and better cover the use cases of our different products.
- We’ve introduced the following new color tokens:
-
var(--n-color-text-danger)
-
var(--n-color-text-highlight)
-
var(--n-color-text-info)
-
var(--n-color-text-neutral)
-
var(--n-color-text-neutral-strong)
-
var(--n-color-text-progress)
-
var(--n-color-text-warning)
-
var(--n-color-text-warning-strong)
-
var(--n-color-border-danger)
-
var(--n-color-border-highlight)
-
var(--n-color-border-info)
-
var(--n-color-border-neutral)
-
var(--n-color-border-progress)
-
var(--n-color-border-success)
-
var(--n-color-border-warning)
-
var(--n-color-surface-lowered)
-
var(--n-color-status-notification)
-
var(--n-color-accent-secondary)
-
- For detailed description of all changes, please see Migration guide.
- Breaking changes are also covered in the migration guide.
- Release date 19.5.2023.
6.4.0
- Adds new
var(--n-space-xs)
space token. - See updated documentation.
- Release date 24.10.2022.
6.3.0
- We now export design tokens as ES modules for easier usage and better tree shaking.
- See updated usage documentation.
- Release date 24.10.2022.
6.2.0
- Adds new
xs
(10px) andxxs
(8px) icon sizes which are replacements for the oldxs
size. This is a non-breaking change so no actions are required from your side. - This is done to improve the rendering of our smallest icons since they now align with the pixel grid used for icons.
- Release date 16.9.2022.
6.1.0
- The small icon dimensions are changed from
11px
to12px
. - Release date 9.9.2022.
6.0.0
- We’ve redesigned the underlying color system to make it more extensible and better cover the use cases of our different products.
- The latest version of Design Tokens introduces a few fundamental changes to the way Nord’s status colors work.
- For more details, please see migration guidelines.
- Release date 7.9.2022.
5.4.1
- Improves documentation for Size Design Tokens.
- Converts
var(--n-size-icon-s)
token from 12px to 11px, so that it looks visually more balanced inside buttons and similar elements. - Updates all Node.js dependencies to latest.
- Release date 17.8.2022.
5.4.0
- Deprecates
n-index-header
andn-index-dropdown
tokens. - Adds new
n-index-nav
design token. - Release date 4.8.2022.
5.3.0
- Adds new
nord-high-contrast
theme and related design tokens. - Adds new
nord-dark-high-contrast
theme and related design tokens. - Removes old
ui
properties and replaces them withtheme
properties instead. - Release date 20.6.2022.
5.2.1
- Small bug fixed and performance improvements.
- Release date 17.6.2022.
5.2.0
- We’ve removed gradients section and skeleton colors, since the new Skeleton component does not utilize these anymore.
- Release date 16.6.2022.
5.1.0
- Switches to using REM based font-sizes instead of pixels for better accessibility.
- Adds new
n-color-overlay
design token that allows you to distinguish a modal layer from the layer underneath. - Release date 14.6.2022.
5.0.0
- We’re deprecating
health-light
,health-dark
,vet-light
andvet-dark
themes to simplify and unify Nordhealth’s branding for all digital products. - Release date 20.5.2022.
4.2.7
- Adds new
transition-mobile
token for mobile menu transitions. Used in mobile versions of Popout and Dropdown components. - Release date 11.5.2022.
4.2.5
- Darkens the
color-nav-surface
in vet light theme to provide better contrast. - Release date 2.5.2022.
4.2.4
- Adds even stronger border color styles for all light themes.
- Adds new card shadow styles with raised surfaces.
- Release date 12.4.2022.
4.2.2
- Converts border colors in default Nord theme to be stronger to match Veterinary theme better.
- Adds new less prominent default, card and header box shadows for all themes.
- Release date 10.4.2022.
4.2.0
- Adds new
line-height-caption
token. - Release date 19.3.2022.
4.1.0
- Adds new
color-text-success
token. - Improves underlying token aliasing.
- Release date 17.3.2022.
4.0.0
- We’re renaming
color-primary
tocolor-accent
to better support our themes. - We’re renaming
color-text-inverse
tocolor-text-on-accent
to better support our themes and better explain where the color should be used. - We’re removing
color-primary-strong
token from the system as it was only referenced in one location. - This color is now replaced with CSS filters inside the system which darken the existing
color-primary
. - Hence all of these are breaking changes, we’re releasing a new major version.
- Release date 14.3.2022.
2.2.1
- Updates previous weak status colors with new dark variants.
- Release date 7.3.2022.
2.2.0
- Adds new weak status colors into design tokens.
- Release date 5.3.2022.
2.1.0
- Redesigned dark gray shades for Vet and Nord dark themes.
- Release date 3.3.2022.
2.0.5
- Updates licensing and package.json details.
- Release date 24.2.2022.
2.0.4
- We’ve changed tokens output to only include nord light theme, and produce additional tokens output for alternative themes to simplify usage.
- Release date 8.2.2022.
2.0.3
- Modifies
color-border-strong
for Nord light theme to match the rest of the themes better. - Release date 13.1.2022.
2.0.2
- Removes
size-icon-input
design token. - Release date 9.12.2021.
2.0.1
- Adds completely new redesigned and more accessible status colors.
- Adds new text weakest color tokens.
- Adds new text error color token.
- Better automatic sorting for tokens behind the scenes.
- Release date 4.12.2021.
1.0.8
- Adds new
n-color-surface-raised
,n-color-surface-raised-dark
,n-color-surface-raised-vet
,n-color-surface-raised-vet-dark
,n-color-surface-raised-health
,n-color-surface-raised-health-dark
design tokens. - Fixes order meta data on color tokens.
- Release date 20.10.2021.
1.0.6
- Converts z-index and transition design tokens to use more consistent naming.
- Small bug fixes and feature improvements.
- Updates Nord package dependencies to latest.
- Release date 17.10.2021.
1.0.0
- Design Tokens package reaches stable state and is now ready for production usage.
- We’ve worked on adding extensive usage documentation for the design tokens.
- Additionally, we’ve added new z-index, transition, and gradient categories.
- All color themes have been re-designed form the ground up to support dark UI.
- All dropshadows have been re-designed.
- Please see the update Design Tokens documentation for more details.
- Release date 12.10.2021.
1.0.0-alpha.13
- Adds new
box-shadow
,box-shadow-modal
,box-shadow-tooltip
,box-shadow-nav
andbox-shadow-card
tokens. - Modifies
color-border
andcolor-background
and adds newcolor-border-dark
for each theme. - Renames
border-radius-small
toborder-radius-s
. - Changes default border-radius from 8px to 5px.
- Adds new
color-overlay
token for modal overlays. - Release date 10.8.2021.
1.0.0-alpha.10
- Modifies dark primary color shades.
- Updates all package dependencies to latest.
- Release date 10.6.2021.