Colors
All Colors are provided by CSS Custom Properties.
You may have a look at the Quick Guide for Designers About Colors.
Colors Table
Change the brand in order to see the related tables:
DNB Colors
| Sample | Type | Brand name | Hex | RGB | Figma Library name | CSS Custom Properties name |
|---|---|---|---|---|---|---|
| Profile | Seagreen | #007272 | 0 114 114 | Profil/Seagreen | --color-sea-green | |
| Profile | Mintgreen | #a5e1d2 | 165 225 210 | Profil/Mintgreen | --color-mint-green | |
| Profile | Summergreen | #28b482 | 40 180 130 | Profil/Summergreen | --color-summer-green | |
| Profile | Emeraldgreen | #14555a | 20 85 90 | Profil/Emeraldgreen | --color-emerald-green | |
| Profile | Oceangreen | #00343e | 0 52 62 | Profil/Oceangreen | --color-ocean-green | |
| Profile | Accent yellow | #fdbb31 | 253 187 49 | Profil/Accentyellow | --color-accent-yellow | |
| Profile | Indigo | #23195a | 35 25 90 | Profil/Indigo | --color-indigo | |
| Profile | Violet | #6e2382 | 110 35 130 | Profil/Violet | --color-violet | |
| Profile | Skyblue | #4bbed2 | 75 190 210 | Profil/Skyblue | --color-sky-blue | |
| Profile | Lavender | #f2f2f5 | 242 242 245 | Profil/Lavender | --color-lavender | |
| Profile | Sand yellow | #fbf6ec | 251 246 236 | Profil/Sandyellow | --color-sand-yellow | |
| Profile | Pistachio | #f2f4ec | 242 244 236 | Profil/Pistachio | --color-pistachio | |
| UX | Seagreen 30% | #b3d5d5 | 179 213 213 | UX/Seagreen 30% | --color-sea-green-30 | |
| UX | Mintgreen 50% | #d2f0e9 | 210 240 233 | UX/Mintgreen 50% | --color-mint-green-50 | |
| UX | Mintgreen 25% | #e9f8f4 | 233 248 244 | UX/Mintgrønn 25% | --color-mint-green-25 | |
| UX | Mintgreen 12% | #f4fbf9 | 244 251 249 | UX/Mintgreen 12% | --color-mint-green-12 | |
| UX | Accent yellow 30% | #feebc1 | 254 235 193 | UX/Accentyellow 30% | --color-accent-yellow-30 | |
| UX | Fire red | #dc2a2a | 220 42 42 | UX/Firered | --color-fire-red | |
| UX | Fire red 8% | #fdeeee | 253 238 238 | UX/Firered 8% | --color-fire-red-8 | |
| UX | Success green | #007b5e | 0 123 94 | UX/Successgreen | --color-success-green | |
| UX | Signal orange | #ff5400 | 255 84 0 | UX/Signalorange | --color-signal-orange | |
| UX | Black | #000 | 0 0 0 | UX/Black | --color-black | |
| UX | Black 80% (aka Coal) | #333 | 51 51 51 | UX/Black 80% | --color-black-80 | |
| UX | Black 55% (aka Dark gray) | #737373 | 115 115 115 | UX/Black 55% | --color-black-55 | |
| UX | Black 20% (aka Soft gray) | #ccc | 204 204 204 | UX/Black 20% | --color-black-20 | |
| UX | Black 8% (aka Outline gray) | #ebebeb | 235 235 235 | UX/Black 8% | --color-black-8 | |
| UX | Black 3% (aka Subtle gray) | #f8f8f8 | 248 248 248 | UX/Black 3% | --color-black-3 | |
| UX | White | #fff | 255 255 255 | UX/White | --color-white |