Nazwany kolor · #FFCC55
Angry Pasta
Angry Pasta to #FFCC55: rgb(255 204 85), hsl(42 100% 67%), oklch(0.869 0.145 85.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Yellow mean? → · Angry Pasta color name →
#FFCC55
oklch(0.869 0.145 85.4)
Konwersje koloru
- HEX
- #ffcc55
- RGB
- rgb(255 204 85)
- HSL
- hsl(42 100% 67%)
- HWB
- hwb(42 33% 0%)
- OKLCH
- oklch(0.869 0.145 85.4)
- OKLab
- oklab(0.869 0.012 0.145)
- CIE Lab
- lab(85.04 9.88 64.17)
- LCH
- lch(85.04 64.93 81.3)
- CMYK
- cmyk(0% 20% 67% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FFD16B
- FFD77F
- FFDC91
- FFE1A2
- FFE7B2
- FFECC2
- FFF1D2
- FFF5E1
- FFFAF0
Odcienie ciemniejsze
- DEB149
- BE973D
- 9E7E31
- 806526
- 634E1C
- 483711
- 2E2208
- 160F02
- 030200
Tony
- F2C45E
- E5BD65
- D8B56B
- CBAE70
- BEA674
- B19F77
- A5977A
- 988F7D
- 8C887E
Harmonie kolorów
Komplementarna +180°
- FFCC55
Angry Pasta
- C0D4FF
≈ Pale Phthalo Blue
Analogowa -30° +30°
- FFCC55
Angry Pasta
- FFC6A0
≈ Romantic
- D0DF67
≈ Chinese Green
Triada +120° +240°
- FFCC55
Angry Pasta
- 3EEDFF
≈ Sparky Blue
- FDB8FF
≈ Distilled Rose
Komplementarna rozszczepiona +150° +210°
- FFCC55
Angry Pasta
- A4DDFF
≈ Droplet
- D7CBFF
≈ Lavender Blue
Tetrada +90° +180° +270°
- FFCC55
Angry Pasta
- 4AF3CF
≈ Onsen
- C0D4FF
≈ Pale Phthalo Blue
- FFBFD6
≈ Cotton Candy
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.49:1 · APCA Lc 23
Ag
AAANa czerni
WCAG 14.02:1 · APCA Lc 80
Najlepszy kolor tekstu: #000000
WCAG 14.02:1 (AAA) · APCA Lc 80
Contrast pairs
Fragmenty kodu
CSS
:root {
--angry-pasta: #ffcc55;
--angry-pasta-rgb: 255 204 85;
--angry-pasta-oklch: oklch(0.869 0.145 85.4);
}
.element {
color: var(--angry-pasta);
background-color: hsl(42 100% 67%);
border-color: oklch(0.869 0.145 85.4);
}Tailwind CSS v4
@theme {
--color-angry-pasta: #ffcc55;
--color-angry-pasta-50: #fff3c6;
--color-angry-pasta-100: #fde6b1;
--color-angry-pasta-200: #efd18b;
--color-angry-pasta-300: #d7b359;
--color-angry-pasta-400: #c59718;
--color-angry-pasta-500: #b17c00;
--color-angry-pasta-600: #966900;
--color-angry-pasta-700: #785400;
--color-angry-pasta-800: #5a3c00;
--color-angry-pasta-900: #3f2900;
--color-angry-pasta-950: #281700;
}SCSS
$angry-pasta: #ffcc55;
$angry-pasta-rgb: 255, 204, 85;
$angry-pasta-light: mix(#fff, $angry-pasta, 20%);
$angry-pasta-dark: mix(#000, $angry-pasta, 20%);
.element {
color: $angry-pasta;
box-shadow: 0 0 0 2px rgba($angry-pasta, 0.35);
}