Getting Started

Welcome to the Provet Cloud Design System. If you’re just getting started with designing or developing something for Provet Cloud, you’re in the right place.

Provet Cloud Design System is Nordhealth’s design system for Provet Cloud’s products, digital experiences and brand. It’s a collection of reusable components and tools, guided by clear standards, that can be assembled together to build digital products and experiences.

The goal of Provet Cloud Design System is to improve UI consistency and quality, while making our software design and development processes more efficient. The system also helps to establish a common vocabulary between everyone in our organization and ease collabo­ration between different teams and disciplines.

Provet Cloud Design System is powered by Nord Design System. Whenever you see something labelled with a “Nord” badge, it means the tool is a part of the parent Nord Design System.



Design guidelines

Check out these practical guides to help you understand how to design for Provet Cloud using the Provet Cloud Design System.


Design Principles

provetcloud.design/principles/

Design Tokens

provetcloud.design/tokens/

Components

provetcloud.design/components/

IconsNord

provetcloud.design/icons/

Figma Toolkit

provetcloud.design/figma/

Color System

provetcloud.design/colors/

Typography Guidelines

provetcloud.design/typography/


Development packages

Provet Cloud Design System is a collection of reusable components and tools that are divided into five packages. They can be used together or separately depending on your team’s needs.


Web Components

provetcloud.design/web-components/

Web Components Vue Types

provetcloud.design/web-components/#types-and-editor-integration

CSS Framework

provetcloud.design/css/

Themes

provetcloud.design/themes/

Design Tokens

provetcloud.design/tokens/


Each package can be installed using Node Package Manager. To do so, run the following command(s) in your terminal:

# Provet Cloud Design System’s packages:
npm install @provetcloud/web-components
npm install @provetcloud/web-components-vue-types
npm install @provetcloud/tokens
npm install @provetcloud/themes
npm install @provetcloud/css
# Parent Nord Design System’s packages:
npm install @nordhealth/icons
npm install @nordhealth/fonts
npm install @nordhealth/color
npm install @nordhealth/ag-theme-nord

For further installation and integration guidelines for each Nord Design System package, please see documentation linked above.


What’s new

This section is updated regularly with new content to help you stay up to date with the latest releases and articles from the Design Systems team. We also have an RSS feed you can subscribe to.


Changelog

provetcloud.design/changelog/

Latest ArticlesNord

provetcloud.design/articles/

Migration Guides

provetcloud.design/migration/


Browser support

Provet Cloud Design System is tested in the latest two versions of the following browsers. Our team addresses critical bug fixes in earlier versions based on their severity and impact. If you need to support IE11 or pre-Chromium Edge, this library isn’t for you.


Chrome Safari Chrome Chrome Chrome

Can I use this in my own project?

Provet Cloud Design System is solely meant for building digital products and experiences for Provet Cloud. Please see the terms of use for full license details.


Getting support

If you experience any issues while getting started with any of Provet Cloud Design System’s tools, please head over to the Support page for more guidelines and help.


Was this page helpful?

YesNo
Send feedback

We use this feedback to improve our documentation.

 
Edit page