Colour
Colours are defined in the NHS iOS App Design as extensions on SwiftUI's Color.
All colours will adapt to dark mode, except for those with the 'Only' suffix, which are fixed.
Accent colour
This is set as the tint colour, and will be used by some native components by default.
| Code | Light | Dark |
|---|---|---|
.nhsAccentColor
|
Core palette
| Code | Light | Dark |
|---|---|---|
.nhsBlue
|
||
.nhsAquaGreen
|
||
.nhsBlack
|
||
.nhsGreen
|
||
.nhsOrange
|
||
.nhsPink
|
||
.nhsPurple
|
||
.nhsRed
|
||
.nhsWhite
|
||
.nhsWarmYellow
|
||
.nhsYellow
|
Greyscale
| Code | Light | Dark |
|---|---|---|
.nhsGrey1
|
||
.nhsGrey2
|
||
.nhsGrey3
|
||
.nhsGrey4
|
||
.nhsGrey5
|
Dark variants
| Code | Light | Dark |
|---|---|---|
.nhsDarkAquaGreen
|
||
.nhsDarkBlue
|
||
.nhsDarkGreen
|
||
.nhsDarkOrange
|
||
.nhsDarkPink
|
||
.nhsDarkPurple
|
||
.nhsDarkRed
|
||
.nhsDarkYellow
|
Pale variants
| Code | Light | Dark |
|---|---|---|
.nhsPaleAquaGreen
|
||
.nhsPaleBlue
|
||
.nhsPaleGreen
|
||
.nhsPaleOrange
|
||
.nhsPalePink
|
||
.nhsPalePurple
|
||
.nhsPaleRed
|
||
.nhsPaleYellow
|
Fixed colours
These use the same colour value in both light and dark mode. Use them when you need a colour that does not change.
| Code | Light | Dark |
|---|---|---|
.nhsBlueOnly
|
||
.nhsAquaGreenOnly
|
||
.nhsBlackOnly
|
||
.nhsGreenOnly
|
||
.nhsOrangeOnly
|
||
.nhsPinkOnly
|
||
.nhsPurpleOnly
|
||
.nhsRedOnly
|
||
.nhsWhiteOnly
|
||
.nhsDarkAquaGreenOnly
|
||
.nhsDarkBlueOnly
|
||
.nhsDarkGreenOnly
|
||
.nhsDarkOrangeOnly
|
||
.nhsDarkPinkOnly
|
||
.nhsDarkPurpleOnly
|
||
.nhsDarkRedOnly
|
||
.nhsDarkYellowOnly
|
||
.nhsPaleAquaGreenOnly
|
||
.nhsPaleBlueOnly
|
||
.nhsPaleGreenOnly
|
||
.nhsPaleOrangeOnly
|
||
.nhsPalePinkOnly
|
||
.nhsPalePurpleOnly
|
||
.nhsPaleRedOnly
|
||
.nhsPaleYellowOnly
|