HEX / Dark Goldenrod
Open color page
Dark Goldenrod in HEX
Dark Goldenrod in HEX: #b8860b. Compare HEX, RGB, HSL, CMYK, LAB, LCH and OKLCH.
Full breakdown
The same color in multiple formats.
Formats
The same color in different formats:
Foreground preview
WCAG contrast checker and foreground picker
Best auto foreground
Best contrast with dark
#0f172a
Auto-selects the strongest contrast against the current background.
Readable text preview
The quick brown fox jumps over the lazy dog.
Contrast ratio
5.49
Passes AA for normal text
| Element | AA | AAA |
|---|---|---|
| Small text | Pass | Fail |
| Large text | Pass | — |
| UI elements / graphics | Pass | N/A |
AA for normal text is typically 4.5:1, AA for large text 3:1, AAA for normal text 7:1, and non-text UI elements typically 3:1.
Export formats
Ready-to-copy snippets for developers, apps, frameworks, and design systems.
#B8860B
| Swatch | Format | Snippet |
|---|---|---|
|
CSS variable
|
||
|
JSON token
|
||
|
Tailwind config
|
||
|
SCSS variable
|
CSS variable
Tokens
JSON token
Tokens
Tailwind config
Tokens
SCSS variable
Tokens
| Swatch | Format | Snippet |
|---|---|---|
|
JavaScript
|
||
|
TypeScript
|
||
|
Inline style
|
||
|
CSS class
|
JavaScript
Frontend
TypeScript
Frontend
Inline style
Frontend
CSS class
Frontend
| Swatch | Format | Snippet |
|---|---|---|
|
Android XML
|
||
|
SwiftUI
|
||
|
Swift UIColor
|
||
|
Kotlin
|
||
|
Flutter
|
||
|
React Native
|
Android XML
Mobile
SwiftUI
Mobile
Swift UIColor
Mobile
Kotlin
Mobile
Flutter
Mobile
React Native
Mobile
| Swatch | Format | Snippet |
|---|---|---|
|
SVG fill
|
||
|
SVG stroke
|
SVG fill
Graphics
SVG stroke
Graphics
Color Variations
tint / shadeTint
Lightened version
#cca84f
Shade
Darkened version
#8c6608
Tone
Muted version
#ac8525
Monochrome
Single-hue family
#614706
Related content
auto-linkedTags
Styles
Use cases
Palettes
Similar colors
Meaning / Aesthetic / Framework
content readyMeaning
Aesthetic
Framework