Latest Releases

Color UtilitiesCSS FrameworkESLint PluginFigma ToolkitNordiconsThemesDesign TokensWeb ComponentsWebfonts

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.

Figma Toolkit

4.0.0 New

  • New major release that introduces a new theming system using Figma Variables!! ✨🥳
  • For detailed description of all changes and the steps required for migration, please see Migration to 4.0.0 Figma Toolkit.
  • Migrates from previous library-based theming system to Figma Variables for improved theme management.
  • Reduces manual steps required for theme switching and eliminates the need to manage multiple separate libraries for theming.
  • Enables automatic theme application when dragging components from the asset panel.
  • Allows multiple themes on one page by applying different themes to individual frames.
  • Expands theme support to include comprehensive coverage for both therapy and veterinary brands, with all themes available for both brands.
  • Theme switching is simplified through the Tokens variable collection mode selector, with no manual library swapping required.
  • Color Styles are now linked with Figma Variables and should be removed in a future update in favor of Variables.
  • Removes the Number Input component, as it never had a coded component counterpart. Use the Input component with stepper functionality instead to maintain design-code parity.
  • Release date 14.11.2025.

3.2.0 New

  • Adds 4 new icons to Nordicons: interface-dnr, interface-cpr-acpr, interface-cpr-unknown and interface-ai.
  • Release date 22.5.2024.

3.1.0

  • Updates Banner Info variant color from text-link to text-info
  • Adds nested Header properties to Card component
  • Renames medical / nertered to medical / neutered-male and adds medical / birthday and interface / duplicate icon to the Nordicons library
  • Adds Header property with S and L size variants to the Drawer
  • Adds Breadcrumbs as a subcomponent for the Header component
  • Release date 29.8.2023.

3.0.0

  • New major release that brings various improvements and bug fixes!! ✨🥳
  • For detailed migration guide, please see Migration to 3.0.0 Figma Toolkit.
  • Below is a summary of included changes:

Design Tokens

  • Updates name from Radius to Border Radius
  • Updates Space component with improved label and Position property

Button

  • Adds ability to show and hide slots through new properties for Start slot and End slot
  • Adds nested instances of the Icon component which can be swapped with any Nordicon
  • Adds Button examples to demonstrate the Button variants and properties
  • Adds Button interactions such as hover, mouse down, and active states
  • Adds Loading as a state property for the Button component which includes animation
  • Removes Icon position property which has been replaced with the new Start slot and End slot properties
  • Updates height of small button from 26px to 28px

Button Group

  • Adds Start slot and End slot to the Button Group slots which allows for adding icons
  • Adds Vertical property toggle to the Button Group
  • Adds Slot property toggles to adjust the number of Buttons in the Button Group
  • Adds nested overrides for adjusting individual button content such as Icon and Button text. This allows all properties for the Button Group to be adjusted from a single properties panel
  • Adds Button Group examples
  • Removes the Content property from the Button Group and which has been replaced with the Slot property
  • Renames state property from Selected to Active

Command Menu

  • Adds No results text property to Command Menu component with an empty state
  • Adds Section text, Text, and Shortcut text properties to the Command Menu
  • Adds hover state to the Command Menu interactions
  • Adds Placeholder text and Input text properties to search input field of Command Menu
  • Adds Slot property which can be used to add and remove Command Menu items
  • Adds Section property which can be used to group Command Menu items
  • Adds Command Menu examples
  • Separates this component into 3 subcomponents to align with the Dropdown Item, Dropdown Group, and Dropdown component
  • Adds S, M, and L size variants
  • Adds Dropdown Header subcomponent with Text property, Header end slot for buttons, and Profile variant
  • Adds toggle to show or hide the dropdown header
  • Adds toggles to customize the number of Dropdown Groups in the Dropdown component
  • Adds nested instances of Dropdown Group and Dropdown Item in the top level properties panel for the Dropdown
  • Adds swap instance property to the Dropdown Group which allows for swapping a Dropdown Group with other content. For example, you can swap dropdowns with messages to create a Notification dropdown within Nord
  • Adds Dropdown examples which also highlight the new interactivity added to the Dropdown component
  • Adds Dropdown Group and Dropdown Item as a new component
  • Adds a Heading property and Heading text property which allows you to toggle and edit Dropdown Group headers
  • Adds autolayout between Dropdown Items nested in the Dropdown Group
  • Adds Slot property for customizing the number of items in a Dropdown Group. Each item uses nested instances of the Dropdown Item
  • Adds Dropdown Group examples

Calendar

  • Adds Surface property toggle. When this property is toggled off it removes the surface, border, and dropshadow of the Calendar component
  • Renames the property Show dot to Highlight day for Calendar Day sub-component
  • Adds nested overrides for month and year dropdown that include Hover, Active, Disabled, and State properties
  • Adds variant Calendar mobile that includes a header and close button. This variant is meant to be used full-width and pinned to the bottom of the viewport
  • Adds Calendar examples

Checkbox

  • Adds S and L size variants to the Checkbox
  • Adds property for Label text, Hint text, and Error text
  • Updates property name Checked to Selected
  • Updates property name Focus to Focus ring
  • Updates disabled style of unselected checkbox
  • Adds Checkbox examples

Checkbox Group

  • Adds property for Checkbox Group Label and Hint
  • Adds Slot property for customizing the number of Checkboxes in a Checkbox Group. Each slot now surfaces nested instances of the Checkbox component

Date picker

  • Adds S and L size variants for the Date Picker
  • Updates state variants to include Read-only and Disabled properties
  • Moves Error property from toggle to state dropdown
  • Adds property for Label Text, Hint, and Error text
  • Adds Start slot which can be used for an icon or a prefix
  • Adds Input Text and Placeholder Text properties
  • Adds End slot which can be used for an icon or a suffix
  • Adds End button property which toggles the visibility of the calendar button
  • Adds Date Picker interactions
  • Adds Date Picker examples

Input

Number input

  • Adds new version of the Number Input
  • Adds properties for Prefix, Suffix, Start Icon, End Icon
  • Adds S and L sizes
  • Updates properties for Label text, Hint text, and Error text
  • Adds Number Input interactivity

Radio

  • Adds S and L size variants for the Radio
  • Updates properties for Label text, Hint text, and Error text
  • Updates Focus ring to be available for all states and variants
  • Renames property Checked to Selected
  • Removes Radio with Border variant
  • Updates disabled unselected Radios to now use Border Neutral for the border color and Active for the fill
  • Adds Slot property for customizing the number of Radios in a Radio Group. Each slot now surfaces nested instances of the Radio component
  • Updates Disabled and Selected Radios to now use color token Border Info
  • Adds Active fill to Unselected Radio variants
  • Adds Radio interactions
  • Adds Radio examples

Select

  • Adds Size property with S, M, and L variants
  • Adds properties for Label text, Hint text, and Error text
  • Adds Text property
  • Adds Start slot for use with icons when needed
  • Adds Select dropdown with Header, Slot for customizing number of dropdown items, and interactions for hover and click
  • Adds Select interactions
  • Adds Select examples

Textarea

Toggle

  • Adds Size property with S, M, and L variants
  • Adds properties for Label text, Hint text, and Error text
  • Updates Unchecked variant color from Border-Strong to Border-Hover
  • Updates Label property which determines label positioning to now be called Reverse order
  • Adds Toggle interactions
  • Adds Focus ring property
  • Adds Toggle examples

Toggle Group

  • Adds properties for Label text, Hint text, and Error text
  • Adds Slot property for customizing the number of Toggles in a Toggle Group. Each slot now surfaces nested instances of the Toggle component.
  • Adds Toggle Group interactions

Filter

  • Moved to the Provet Product Patterns Figma document
  • Updates text and surface colors for the Banner
  • Adds status border color to each variant
  • Removes variant with dropshadow
  • Adds Text property
  • Adds Banner examples

Empty State

  • Removes Variant property
  • Adds Header and Text properties
  • Adds Buttons property toggle to show or hide buttons
  • Adds Empty State examples

Toast

  • Adds Text property
  • Adds Variant property which include options for Default and Danger
  • Removes Button state property

Notification

Notification Group

Progress Bar

Spinner

  • Adds Header slot which supports the Clinic Switcher
  • Adds Default slot which contains the main navigation content
  • Adds Bottom slot to the Navigation component
  • Adds Navigation interactions
  • Adds toggles to enable Quick View and Top Bar properties
  • Adds support for nested properties to show all properties from the top level of the component
  • Adds Navigation examples

Top Bar

  • Adds new Top Bar component
  • Adds new Top Bar dropdown for Notifications
  • Adds new Top Bar dropdown for My Tasks
  • Adds new Top Bar dropdown for Profile

Divider

  • Adds Padding size property which supports S, M, L, XL, and XXL sizes
  • Adds ability to remove padding from one or both sides of the divider
  • Adds Show redlines property to show or hide padding labels
  • Adds Divider examples
  • Adds S size variant which is appropriate when using the Top Bar component
  • Adds a Default slot property to the header which includes properties for the Navigation Toggle and Header text. The Default slot can now be swapped with custom local content
  • Adds an End slot property to the header which can be used for buttons. The End slot can be swapped with custom local content
  • Adds nested properties for buttons to the top level of the Header component
  • Adds Header examples

Badge

  • Removes Progress badge variant
  • Adds Strong variant for each badge status
  • Adds ability to add a Check, Cancelled, or Warning icon to the badge component
  • Adds Badge examples

Message

Paragraph

Nord Theme

  • Adds accent-secondary, text-danger, text-neutral, text-neutral-strong, text-warning, text-warning-strong, text-highlight, text-info, text-progress, border-neutral,border-warning, border-highlight, border-danger,border-success, border-info, border-progress,surface-lowered, header, status-notification
  • Updates text-error, text-success, nav-surface, nav-hover, background, status-neutral, status-warning, status-highlight, status-danger, status-success, status-info, status-progress, status-success-weak, status-progress-weak, status-info-weak, status-highlight-weak, status-neutral-weak, status-warning-weak, status-danger-weak, button

Release date

  • Release date 10.8.2023.

2.11.0

  • Adds new file-invoice, file-treatment-plan, file-patient-records, generic-farm, generic-hospital, generic-company, generic-inventory, interface-skipped, medical-neutered, medical-spayed, medical-surgery, medical-drip and navigation-finances icons.
  • Updates navigation-reports icon.
  • Adds tagging for new Nordicons in Figma Nordicons Library.
  • Release date 12.4.2023.

2.10.0

  • Updates Avatar component
  • Updates generic avatar colors.
  • Adds client, patient, and staff avatar variants.
  • Updates avatar sizes.
  • Adds XXL avatar size.
  • Release date 23.3.2023.

2.9.0

  • Updates Card component to use space-L token for horizontal padding.
  • Deprecates List component.
  • Adds Description list component and removes padding from base component.
  • Updates component name of Sheet component to Drawer, adds fixed footer, and custom content slots.
  • Release date 28.9.2022.

2.8.0

  • Adds new version of the Input Component. This includes support for prefix, suffix, icons, and sizes for small and large sizes for the Input component.
  • Updates the pagination component to enable interactivity and jump to first & last page.
  • Adds new xs (10px) and xxs (8px) icon sizes which are replacements for the old xs size. This is a non-breaking change so no actions are required from your side.
  • Adds new animal category icons: generic-suidae, generic-sheep, generic-rodents, generic-reptilia, generic-leporidae, generic-fish, generic-feline, generic-equidae, generic-cattle, generic-canine, generic-birds, generic-arachnida, generic-amphibia.
  • Changes medical-insurance icon from “a hand holding a plus sign” to represent “a shield.”
  • Updates default card radius to default-radius token.
  • Updates Button Group component.
  • Updates List, Sheet, and Table components to new Badge style.
  • Updates Figma Color Styles to the redesigned color system and new status colors: https://nordhealth.design/tokens/
  • Release date 15.9.2022.

2.7.0

  • Adds new medical-insurance icon to Nordicons.
  • Release date 24.8.2022.

2.6.0

  • Adds interactivity to Navigation component and Clinic Switcher.
  • Adds Table header sorting with interactivity.
  • Updates naming convention to s/m/l for buttons.
  • Updates naming convention for Nordicons.
  • Adds new interface-grabber, interface-grid, interface-sort-small, interface-sort-up-small and interface-sort-down-small icons to Nordicons.
  • Release date 10.8.2022.

2.5.0

  • Adds number input component with interactivity.
  • Adds interactivity to checkbox and checkbox group.
  • Release date 1.7.2022.

2.4.0

  • Spacing token improvements in Figma including fill horizontal and fill vertical variants.
  • Added labels inside of each component.
  • Examples of auto-layout with space tokens.
  • Removed button base component from library.
  • Removed button group atoms from library.
  • Release date 27.6.2022.

2.3.2

  • Adding toast button variants.
  • Updated toast component to add danger style & instance swap for close button.
  • Release date 22.6.2022.

2.2.12

  • Bugfix for card header update.
  • Generic bug fixes.
  • Updated default button placeholder text.
  • Added buttons and selection indicator to card header.
  • Fixed default instance of checkbox component in table components.
  • Release date 16.6.2022.

2.2.8

  • Removed redundant navigation indicator.
  • Reverted to original position for notification indicator.
  • Updated notification position in Navigation component.
  • Added indeterminate checkbox variant.
  • Table cell alignment correction.
  • Updated spacing for table component.
  • Release date 14.6.2022.

2.2.2

  • Updated header component to improve sort indicator.
  • Added sort indicator to table.
  • Removed sort variant from cell columns and moved to atom/cell.
  • Generic Bugfixes.
  • Added sort icon to Nordicons.
  • Release date 9.6.2022.

2.1.1

  • Updated navigation component to preserve text and color overrides following icon component update.
  • Removed instances of deprecated Nordicons component.
  • Release date 1.6.2022.

2.1.0

  • Created a new Icon component to add search and categories to improve icon findability in Figma.
  • Previous Icon component has been deprecated and moved to the Nordicons file for reference when migrating to the new component.
  • Updated banner component to preserve text overrides.
  • Modified the modal component with image to use the default button styling for improved legibility.
  • Release date 31.5.2022.

2.0.1

  • Removed deprecated drop shadow styling to move to updated theme.

2.0.0

  • Switches to using native theming for Nord dark and light themes, meaning we now use Figma Libraries instead of the previous Themer Plugin.
  • We’ve removed separate Healthcare and Veterinary themes and made the Nord light theme the default. Nord dark theme exists still as well. We will next do a similar change in the code based system as well and will release new major versions of all packages that rely on the theming.
  • We’ve added new stronger border color styles for the light Nord theme to reflect recent changes in our design tokens.
  • We’ve added new card shadow styles with raised surfaces to reflect recent changes in our design tokens.
  • Color libraries are moved onto separate files out of the Nord Figma Toolkit.
  • Minor bug fixes and cleanup.

1.0.3

  • Minor changes to tokens to enable native theming in Figma.

1.0.2

  • Fixed alignment issue with select component expanded state.

1.0.1

  • Moving Nordicons to a separate file to comply with license requirements.

1.0.0

  • Initial release of Nord Figma Toolkit.
  • Release date 17.3.2022.

Was this page helpful?

Yes No

We use this feedback to improve our documentation.