Nazwany kolor · #3F363D
Treasure Seeker
Treasure Seeker to #3F363D: rgb(63 54 61), hsl(313 8% 23%), oklch(0.345 0.017 333.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Treasure Seeker color name →
#3F363D
oklch(0.345 0.017 333.6)
Konwersje koloru
- HEX
- #3f363d
- RGB
- rgb(63 54 61)
- HSL
- hsl(313 8% 23%)
- HWB
- hwb(313 21% 75%)
- OKLCH
- oklch(0.345 0.017 333.6)
- OKLab
- oklab(0.345 0.015 -0.008)
- CIE Lab
- lab(23.78 5.23 -2.85)
- LCH
- lch(23.78 5.95 331.4)
- CMYK
- cmyk(0% 14% 3% 75%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 50474E
- 625A60
- 746D72
- 868085
- 999498
- ADA9AC
- C1BEC0
- D5D3D5
- EAE9EA
Odcienie ciemniejsze
- 352E34
- 2C252B
- 231E22
- 1B161A
- 120F12
- 0A080A
- 040304
- 010101
- 000000
Tony
- 453D43
- 4B444A
- 524B50
- 585257
- 5F5A5D
- 656164
- 6C696B
- 727072
- 797879
Harmonie kolorów
Komplementarna +180°
- 3F363D
Treasure Seeker
- 333C35
≈ Sound of Silence
Analogowa -30° +30°
- 3F363D
Treasure Seeker
- 3B3741
≈ Black Marlin
- 413638
≈ Monastery Mantle
Triada +120° +240°
- 3F363D
Treasure Seeker
- 3C392F
≈ Rosin
- 2F3C3F
≈ Edge of the Galaxy
Komplementarna rozszczepiona +150° +210°
- 3F363D
Treasure Seeker
- 373B31
≈ USMC Green
- 303C3A
≈ Rookwood Shutter Green
Tetrada +90° +180° +270°
- 3F363D
Treasure Seeker
- 403730
≈ Fired Earth
- 333C35
≈ Sound of Silence
- 323A42
≈ Tempest in a Teapot
Kontrast i dostępność
Ag
AAANa bieli
WCAG 11.62:1 · APCA Lc 97
Ag
FailNa czerni
WCAG 1.80:1 · APCA Lc 0
Najlepszy kolor tekstu: #FFFFFF
WCAG 11.62:1 (AAA) · APCA Lc 97
Contrast pairs
Fragmenty kodu
CSS
:root {
--treasure-seeker: #3f363d;
--treasure-seeker-rgb: 63 54 61;
--treasure-seeker-oklch: oklch(0.345 0.017 333.6);
}
.element {
color: var(--treasure-seeker);
background-color: hsl(313 8% 23%);
border-color: oklch(0.345 0.017 333.6);
}Tailwind CSS v4
@theme {
--color-treasure-seeker: #3f363d;
--color-treasure-seeker-50: #f8f3f7;
--color-treasure-seeker-100: #ece6ea;
--color-treasure-seeker-200: #d9d2d7;
--color-treasure-seeker-300: #bdb4bb;
--color-treasure-seeker-400: #a59ba3;
--color-treasure-seeker-500: #8e828b;
--color-treasure-seeker-600: #786e76;
--color-treasure-seeker-700: #60585e;
--color-treasure-seeker-800: #464045;
--color-treasure-seeker-900: #302c30;
--color-treasure-seeker-950: #1d191c;
}SCSS
$treasure-seeker: #3f363d;
$treasure-seeker-rgb: 63, 54, 61;
$treasure-seeker-light: mix(#fff, $treasure-seeker, 20%);
$treasure-seeker-dark: mix(#000, $treasure-seeker, 20%);
.element {
color: $treasure-seeker;
box-shadow: 0 0 0 2px rgba($treasure-seeker, 0.35);
}