Nazwany kolor · #A33F40
No More Drama
No More Drama to #A33F40: rgb(163 63 64), hsl(359 44% 44%), oklch(0.505 0.133 22.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · No More Drama color name →
#A33F40
oklch(0.505 0.133 22.5)
Konwersje koloru
- HEX
- #a33f40
- RGB
- rgb(163 63 64)
- HSL
- hsl(359 44% 44%)
- HWB
- hwb(359 25% 36%)
- OKLCH
- oklch(0.505 0.133 22.5)
- OKLab
- oklab(0.505 0.123 0.051)
- CIE Lab
- lab(41.25 42.21 22.01)
- LCH
- lch(41.25 47.61 27.5)
- CMYK
- cmyk(0% 61% 61% 36%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- AE5352
- B96664
- C37976
- CD8C89
- D69F9B
- DFB2AF
- E8C5C2
- F0D8D6
- F8EBEA
Odcienie ciemniejsze
- 8D3536
- 782C2D
- 632324
- 4F1B1B
- 3C1213
- 2A0A0B
- 190405
- 0A0101
- 010000
Tony
- A14747
- 9E4F4D
- 9C5654
- 995C5A
- 966360
- 926967
- 8E6F6D
- 8A7573
- 857A7A
Harmonie kolorów
Komplementarna +180°
- A33F40
No More Drama
- 00737A
≈ Scurf Green
Analogowa -30° +30°
- A33F40
No More Drama
- 9B3F6C
≈ Dynamo
- 9C4B00
≈ Burnt Bagel
Triada +120° +240°
- A33F40
No More Drama
- 2E772A
≈ Japanese Laurel
- 3A61B0
≈ Kakitsubata Blue
Komplementarna rozszczepiona +150° +210°
- A33F40
No More Drama
- 00765F
≈ Tropical Rainforest
- 006E96
≈ Tropic Sea
Tetrada +90° +180° +270°
- A33F40
No More Drama
- 666B00
≈ Brownish Green
- 00737A
≈ Scurf Green
- 6853A9
≈ Ultrapurple Merge
Kontrast i dostępność
Ag
AANa bieli
WCAG 6.28:1 · APCA Lc 81
Ag
FailNa czerni
WCAG 3.34:1 · APCA Lc 21
Najlepszy kolor tekstu: #FFFFFF
WCAG 6.28:1 (AA) · APCA Lc 81
Contrast pairs
Fragmenty kodu
CSS
:root {
--no-more-drama: #a33f40;
--no-more-drama-rgb: 163 63 64;
--no-more-drama-oklch: oklch(0.505 0.133 22.5);
}
.element {
color: var(--no-more-drama);
background-color: hsl(359 44% 44%);
border-color: oklch(0.505 0.133 22.5);
}Tailwind CSS v4
@theme {
--color-no-more-drama: #a33f40;
--color-no-more-drama-50: #ffe7e2;
--color-no-more-drama-100: #ffd7d2;
--color-no-more-drama-200: #ffbfb8;
--color-no-more-drama-300: #f49c95;
--color-no-more-drama-400: #e27d7a;
--color-no-more-drama-500: #cf5d5c;
--color-no-more-drama-600: #af4f4e;
--color-no-more-drama-700: #8d3f3e;
--color-no-more-drama-800: #692d2e;
--color-no-more-drama-900: #4a1e1f;
--color-no-more-drama-950: #300e0f;
}SCSS
$no-more-drama: #a33f40;
$no-more-drama-rgb: 163, 63, 64;
$no-more-drama-light: mix(#fff, $no-more-drama, 20%);
$no-more-drama-dark: mix(#000, $no-more-drama, 20%);
.element {
color: $no-more-drama;
box-shadow: 0 0 0 2px rgba($no-more-drama, 0.35);
}