Najbliższy nazwany kolor · #AF6700
#AF6700
Najbliższy nazwany kolor: Ginger
#AF6700 (rgb(175 103 0), hsl(35 100% 34%), oklch(0.581 0.131 64.3)) jest najbliższy nazwanemu kolorowi Ginger. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#AF6700
oklch(0.581 0.131 64.3)
Konwersje koloru
- HEX
- #af6700
- RGB
- rgb(175 103 0)
- HSL
- hsl(35 100% 34%)
- HWB
- hwb(35 0% 31%)
- OKLCH
- oklch(0.581 0.131 64.3)
- OKLab
- oklab(0.581 0.057 0.118)
- CIE Lab
- lab(50.99 25.39 58.47)
- LCH
- lch(50.99 63.74 66.5)
- CMYK
- cmyk(0% 41% 100% 31%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- B8762F
- C0854A
- C99462
- D1A379
- D9B38F
- E1C2A5
- E9D1BB
- F0E0D2
- F8F0E8
Odcienie ciemniejsze
- 985900
- 814B00
- 6B3D00
- 563000
- 412300
- 2E1700
- 1C0C00
- 0B0400
- 010000
Tony
- AB6A20
- A76D31
- A2703E
- 9E7349
- 997554
- 94785D
- 907A66
- 8B7C6F
- 857E78
Harmonie kolorów
Komplementarna +180°
- AF6700
Ginger
- 2181C2
≈ Eye Blue
Analogowa -30° +30°
- AF6700
Ginger
- BB5A43
≈ Mecca Orange
- 927900
≈ Bhūrā Brown
Triada +120° +240°
- AF6700
Ginger
- 008E82
≈ Aqua Experience
- 8C65B9
≈ Lavish Spending
Komplementarna rozszczepiona +150° +210°
- AF6700
Ginger
- 008AA0
≈ Teal Blue
- 6472C8
≈ Indigo Light
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
FailNa bieli
WCAG 4.40:1 · APCA Lc 70
Ag
AANa czerni
WCAG 4.76:1 · APCA Lc 32
Najlepszy kolor tekstu: #000000
WCAG 4.76:1 (AA) · APCA Lc 32
Contrast pairs
Fragmenty kodu
CSS
:root {
--ginger: #af6700;
--ginger-rgb: 175 103 0;
--ginger-oklch: oklch(0.581 0.131 64.3);
}
.element {
color: var(--ginger);
background-color: hsl(35 100% 34%);
border-color: oklch(0.581 0.131 64.3);
}Tailwind CSS v4
@theme {
--color-ginger: #af6700;
--color-ginger-50: #ffefce;
--color-ginger-100: #ffe0ba;
--color-ginger-200: #fbca98;
--color-ginger-300: #e5aa6c;
--color-ginger-400: #d48c42;
--color-ginger-500: #c07000;
--color-ginger-600: #a25f00;
--color-ginger-700: #824c02;
--color-ginger-800: #623603;
--color-ginger-900: #452503;
--color-ginger-950: #2c1300;
}SCSS
$ginger: #af6700;
$ginger-rgb: 175, 103, 0;
$ginger-light: mix(#fff, $ginger, 20%);
$ginger-dark: mix(#000, $ginger, 20%);
.element {
color: $ginger;
box-shadow: 0 0 0 2px rgba($ginger, 0.35);
}