Content Delivery Network
Provet Cloud Design System serves its packages via CDN for better performance and stability. Provet Cloud CDN also makes it faster to implement and use our packages in production.
A content delivery network (CDN) is a group of geographically distributed servers that speed up the delivery of web content by bringing it closer to where users are. CDNs cache content like web pages, images, and video in proxy servers near to your physical location. Some of the benefits of using Provet Cloud’s CDN includes:
- Faster load times and better performance for all users
- CDN scales more rapidly during heavy traffic
- Minimizes risk of traffic spikes at point of origin, ensuring stability
- Decreases infrastructure costs due to traffic offloading
- Faster to get up and running with development work
Available packages
The following packages are available for usage via Provet Cloud CDN:
- Web Components:
https://nordcdn.net/ds/provetcloud/web-components/
- Design Tokens:
https://nordcdn.net/ds/provetcloud/tokens/
- Themes:
https://nordcdn.net/ds/provetcloud/themes/
- CSS Framework:
https://nordcdn.net/ds/provetcloud/css/
You can also utilize the following Nord Design System’s packages via the same CDN:
- Webfonts:
https://nordcdn.net/ds/fonts/
- Nordicons:
https://nordcdn.net/ds/icons/
- Color Utilities:
https://nordcdn.net/ds/color/
- Ag Theme Nord:
https://nordcdn.net/ds/ag-theme-nord/
URL structure
Provet Cloud CDN uses the following URL structure for the hosted packages:
https://nordcdn.net/ds/provetcloud/<package>/<version>/<file>
To fetch e.g. the Web Components using the above format, you would write it like:
https://nordcdn.net/ds/provetcloud/web-components/1.0.0/index.js
- To find URLs for Webfonts, see Webfonts documentation
- To find URLs for Design Tokens, see Design Tokens documentation
- To find URLs for Themes, see Themes documentation
- To find URLs for Nordicons, see Nordicons documentation
- To find URLs for Color Utilities, scroll down.
- To find URLs for AG Theme Nord, scroll down.
Subresource Integrity
Subresource Integrity is a security feature that enables browsers to verify that resources they fetch from a CDN are delivered without unexpected manipulation. It works by allowing you to provide a cryptographic hash that a fetched resource must match (source: MDN).
Our documentation automatically provides cryptographic hashes for the latest available package versions. To enable SRI verification, use the following tags in the <head>
of your application:
Design Tokens
<link rel="stylesheet" href="https://nordcdn.net/ds/provetcloud/tokens/1.0.0/tokens.custom-properties.css" integrity="sha384-VK/JPz9bWmhfdeh0J8Zpd/cpSMbKj0SBMzr/5lONiNYFY6U7XzjjQgRYLJt4XfPd" crossorigin="anonymous" />
Web Components
<script type="module" src="https://nordcdn.net/ds/provetcloud/web-components/1.3.2/index.js" integrity="sha384-KDN832iCw/B3PvEG7/f8pjlBYkAwdpfbhtq4NBRnYaQvIijaSrtqQ23YqIRDKhvI" crossorigin="anonymous"></script>
CSS Framework
<link rel="stylesheet" href="https://nordcdn.net/ds/provetcloud/css/1.1.0/provet.min.css" integrity="sha384-1oPScOelquAHG7S9/NvXjf0pzu2XCqVDlTcdBiODTq4frAn/By0t8LStOJuHCN1i" crossorigin="anonymous" />
Themes
<!-- Light default theme -->
<link rel="stylesheet" href="https://nordcdn.net/ds/provetcloud/themes/1.0.0/provet.css" integrity="sha384-m91LHupcnWiGya8NVLut8CbIzk4BXmIyANudHXe2506i9wlTr4ccncegBmvsAThA" crossorigin="anonymous" />
<!-- Light high contrast theme -->
<link rel="stylesheet" href="https://nordcdn.net/ds/provetcloud/themes/1.0.0/provet-high-contrast.css" integrity="sha384-fbLjK//LfE5FFaBHp9DvaZCNWnVTuEA57zX/IolnOWbDZuSF9PtgDTMNqKsJtvp7" crossorigin="anonymous" />
<!-- Dark default theme -->
<link rel="stylesheet" href="https://nordcdn.net/ds/provetcloud/themes/1.0.0/provet-dark.css" integrity="sha384-Iuru6O5PBD9zuQgQfPdDPG2xi/VOwtaFEoF8TQxXewAqJF70UeXPVaN/TjmRNABQ" crossorigin="anonymous" />
<!-- Dark high contrast theme -->
<link rel="stylesheet" href="https://nordcdn.net/ds/provetcloud/themes/1.0.0/provet-dark-high-contrast.css" integrity="sha384-QtM+aBxPxUr2tIzhJxYufPFblRmd//5ZhGVyY+PgezK9YQdjhYRg2ft7KR63x7Pc" crossorigin="anonymous" />
IconsNord
<img src="https://nordcdn.net/ds/icons/3.7.0/assets/[ICON NAME].svg" height="24" width="24" alt="" />
WebfontsNord
<link rel="stylesheet" href="https://nordcdn.net/ds/fonts/3.0.2/fonts.css" integrity="sha384-dkSLlcNlq50O3Ils6+x72v07BbSaUb10p9/GEuuIJBcR1d0Nn+lDdvUQoXYz2Dq9" crossorigin="anonymous" />
Color UtilitiesNord
<script src="https://nordcdn.net/ds/color/2.1.1/index.min.js" integrity="sha384-jxrTtdfF/6hvgvhLE4alDoHJFk9JrEs860SBDqh8N/S4EMQ6Q9UA3CTRLbAEGY3i" crossorigin="anonymous"></script>
AG Theme NordNord
<link rel="stylesheet" href="https://nordcdn.net/ds/ag-theme-nord/2.1.1/ag-theme-nord.min.css" integrity="sha384-NsmV8z1nnwWJXIdEazyqkWsKw2lKvViZtzCTRLEhx0hCaRQTTDoTazbJRggFP0S5" crossorigin="anonymous" />
Available versions
Provet Cloud CDN includes versioned releases of the following packages starting from:
- @provetcloud/tokens:
1.0.0-alpha.7
and newer - @provetcloud/web-components:
1.0.0-alpha.7
and newer - @provetcloud/themes:
1.0.0-alpha.7
and newer - @provetcloud/css:
1.0.0-alpha.7
and newer
We also provide the following Nord Design System packages starting from:
- @nordhealth/icons:
1.0.0
and newer - @nordhealth/fonts:
2.0.0
and newer - @nordhealth/color:
1.0.0
and newer - @nordhealth/ag-theme-nord:
1.0.0
and newer
Can I use Provet Cloud CDN 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
Need help with Provet Cloud CDN? Please head over to the Support page for more guidelines and ways to contact us.