Logo
Use the primary logo on light backgrounds and the white logo on dark backgrounds or photography. Keep clear space around the mark and never recolor or distort it.
Primary logo
Full logo with wordmark. Use on light backgrounds.
Logo icon
App icon / favicon mark with rounded container.
Logomark
The F mark isolated — for tight spaces and small sizes.
White logo
Reversed logo for dark backgrounds and photography.
Color
The Fortiv color system — each palette runs from 50 (lightest) to 950 (darkest), exposed as CSS custom properties. Click any swatch to copy its hex.
Moss Canopy
Greens for success states and positive feedback
50--moss-canopy-50#E2F1E8
100--moss-canopy-100#DBF3E6
200--moss-canopy-200#C6E7D2
300--moss-canopy-300#9ED9B4
400--moss-canopy-400#77C896
500--moss-canopy-500#51B57A
600--moss-canopy-600#369D61
700--moss-canopy-700#16803D
800--moss-canopy-800#166633
900--moss-canopy-900#14532E
950--moss-canopy-950#064322
Glacial Lake
Blues for primary actions and links
50--glacial-lake-50#F1F9FF
100--glacial-lake-100#E0F2FE
200--glacial-lake-200#BAE6FE
300--glacial-lake-300#7DD4FC
400--glacial-lake-400#32C1FF
500--glacial-lake-500#06A9F4
600--glacial-lake-600#0085CA
700--glacial-lake-700#0369A1
800--glacial-lake-800#055985
900--glacial-lake-900#0A4A6E
950--glacial-lake-950#092F49
Ion Drive
Blues for informational states
50--ion-drive-50#EFF6FF
100--ion-drive-100#DBEAFE
200--ion-drive-200#BFDBFE
300--ion-drive-300#93C5FD
400--ion-drive-400#5BA4FF
500--ion-drive-500#3380FF
600--ion-drive-600#1B5FF5
700--ion-drive-700#1D4FD8
800--ion-drive-800#1E40AF
900--ion-drive-900#1D3B8A
950--ion-drive-950#172454
Solar Flare
Yellows and oranges for warnings
50--solar-flare-50#FFFBEB
100--solar-flare-100#FEF3C7
200--solar-flare-200#FEE78A
300--solar-flare-300#FCD34D
400--solar-flare-400#FFC122
500--solar-flare-500#FFA100
600--solar-flare-600#DF7801
700--solar-flare-700#B45308
800--solar-flare-800#92400E
900--solar-flare-900#78350F
950--solar-flare-950#451A03
Sienna Glow
Warm oranges for accents
50--sienna-glow-50#FFF7ED
100--sienna-glow-100#FFEDD5
200--sienna-glow-200#FED7AA
300--sienna-glow-300#FDBA74
400--sienna-glow-400#FF9338
500--sienna-glow-500#FF720F
600--sienna-glow-600#F55501
700--sienna-glow-700#C2410C
800--sienna-glow-800#9B3312
900--sienna-glow-900#7C2D12
950--sienna-glow-950#441406
Thermal Bloom
Reds for alerts and critical states
50--thermal-bloom-50#FEF3F2
100--thermal-bloom-100#FEE2E3
200--thermal-bloom-200#FECBCA
300--thermal-bloom-300#FDA5A6
400--thermal-bloom-400#FF6B6B
500--thermal-bloom-500#F83B3B
600--thermal-bloom-600#E61C1D
700--thermal-bloom-700#BA1B1B
800--thermal-bloom-800#9A1C1B
900--thermal-bloom-900#801D1D
950--thermal-bloom-950#45090A
Nebula Spark
Purples for creative accents
50--nebula-spark-50#F5F4FF
100--nebula-spark-100#EDE9FE
200--nebula-spark-200#DDD7FE
300--nebula-spark-300#C4B5FD
400--nebula-spark-400#A686FF
500--nebula-spark-500#8855FE
600--nebula-spark-600#7A31F6
700--nebula-spark-700#6D29D9
800--nebula-spark-800#5B22B7
900--nebula-spark-900#4C1D96
950--nebula-spark-950#2E1066
Alpine Rose
Pinks for errors and destructive actions
50--alpine-rose-50#FEF2F8
100--alpine-rose-100#FCE7F3
200--alpine-rose-200#FBCFE8
300--alpine-rose-300#F9A9D4
400--alpine-rose-400#FB6CB7
500--alpine-rose-500#F44099
600--alpine-rose-600#E41E76
700--alpine-rose-700#BE175D
800--alpine-rose-800#9D174D
900--alpine-rose-900#831843
950--alpine-rose-950#500624
Misty Dune
Warm creams and earth tones for surface backgrounds
50--misty-dune-50#FBF9F7
100--misty-dune-100#F7F4EE
200--misty-dune-200#EEE8DD
300--misty-dune-300#E4D9C6
400--misty-dune-400#D6C8B0
500--misty-dune-500#C2B396
600--misty-dune-600#AD9E80
700--misty-dune-700#938568
800--misty-dune-800#7A6F56
900--misty-dune-900#5D5441
950--misty-dune-950#423C2D
Volcanic Ash
Neutrals for text, borders, and backgrounds
50--volcanic-ash-50#F9FAFB
100--volcanic-ash-100#F3F4F6
200--volcanic-ash-200#E5E7EB
300--volcanic-ash-300#D2D5DB
400--volcanic-ash-400#9CA3AF
500--volcanic-ash-500#6B7280
600--volcanic-ash-600#4C5563
700--volcanic-ash-700#394150
800--volcanic-ash-800#212936
900--volcanic-ash-900#121826
950--volcanic-ash-950#030711
Typography
Space Grotesk carries the brand voice in display and headings; Geist handles UI and body text; Geist Mono is used for code and data.
Space Grotesk
Display & headings — brand voice
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
Geist Mono
Code, tokens, and data
The quick brown fox jumps over the lazy dog
