Nazwany kolor · #CE9F2F
Herald’s Trumpet
Herald’s Trumpet to #CE9F2F: rgb(206 159 47), hsl(42 63% 50%), oklch(0.728 0.134 84.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Herald’s Trumpet color name →
#CE9F2F
oklch(0.728 0.134 84.5)
Konwersje koloru
- HEX
- #ce9f2f
- RGB
- rgb(206 159 47)
- HSL
- hsl(42 63% 50%)
- HWB
- hwb(42 18% 19%)
- OKLCH
- oklch(0.728 0.134 84.5)
- OKLab
- oklab(0.728 0.013 0.134)
- CIE Lab
- lab(68.58 10.42 61.18)
- LCH
- lch(68.58 62.06 80.3)
- CMYK
- cmyk(0% 23% 77% 19%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D3A94C
- D8B363
- DDBC79
- E2C68D
- E7CFA0
- ECD9B3
- F1E2C6
- F5ECD9
- FAF6EC
Odcienie ciemniejsze
- B38A27
- 987520
- 7F6119
- 664D12
- 4E3B0C
- 382906
- 231803
- 0F0901
- 020100
Tony
- C69C3E
- BE994A
- B69653
- AE935C
- A79063
- 9F8D6A
- 978A70
- 8F8776
- 88837B
Harmonie kolorów
Komplementarna +180°
- CE9F2F
Herald’s Trumpet
- 7CA5FB
≈ Fennel Flower
Analogowa -30° +30°
- CE9F2F
Herald’s Trumpet
- E78E4E
≈ Acapulco Sun
- A5B042
≈ Elysian Green
Triada +120° +240°
- CE9F2F
Herald’s Trumpet
- 00BDCB
≈ Panorama Blue
- D188D6
≈ Blush Essence
Komplementarna rozszczepiona +150° +210°
- CE9F2F
Herald’s Trumpet
- 3AB4EE
≈ Lynx Screen Blue
- AD95F2
≈ Dreamy Candy Forest
Tetrada +90° +180° +270°
- CE9F2F
Herald’s Trumpet
- 19C2A1
≈ Jade Mountain
- 7CA5FB
≈ Fennel Flower
- E881AC
≈ Aurora Pink
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.43:1 · APCA Lc 48
Ag
AAANa czerni
WCAG 8.62:1 · APCA Lc 54
Najlepszy kolor tekstu: #000000
WCAG 8.62:1 (AAA) · APCA Lc 54
Contrast pairs
Fragmenty kodu
CSS
:root {
--herald-s-trumpet: #ce9f2f;
--herald-s-trumpet-rgb: 206 159 47;
--herald-s-trumpet-oklch: oklch(0.728 0.134 84.5);
}
.element {
color: var(--herald-s-trumpet);
background-color: hsl(42 63% 50%);
border-color: oklch(0.728 0.134 84.5);
}Tailwind CSS v4
@theme {
--color-herald-s-trumpet: #ce9f2f;
--color-herald-s-trumpet-50: #fff3ca;
--color-herald-s-trumpet-100: #fce6b5;
--color-herald-s-trumpet-200: #edd191;
--color-herald-s-trumpet-300: #d5b362;
--color-herald-s-trumpet-400: #c3972f;
--color-herald-s-trumpet-500: #af7c00;
--color-herald-s-trumpet-600: #946900;
--color-herald-s-trumpet-700: #775400;
--color-herald-s-trumpet-800: #593d00;
--color-herald-s-trumpet-900: #3e2a00;
--color-herald-s-trumpet-950: #271700;
}SCSS
$herald-s-trumpet: #ce9f2f;
$herald-s-trumpet-rgb: 206, 159, 47;
$herald-s-trumpet-light: mix(#fff, $herald-s-trumpet, 20%);
$herald-s-trumpet-dark: mix(#000, $herald-s-trumpet, 20%);
.element {
color: $herald-s-trumpet;
box-shadow: 0 0 0 2px rgba($herald-s-trumpet, 0.35);
}