色名 · #383E5D
Mangosteen
Mangosteenは#383E5D：rgb(56 62 93)、hsl(230 25% 29%)、oklch(0.373 0.054 275.1)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Blue mean? → · Mangosteen color name →
#383E5D
oklch(0.373 0.054 275.1)
カラー変換
- HEX
- #383e5d
- RGB
- rgb(56 62 93)
- HSL
- hsl(230 25% 29%)
- HWB
- hwb(230 22% 64%)
- OKLCH
- oklch(0.373 0.054 275.1)
- OKLab
- oklab(0.373 0.005 -0.054)
- CIE Lab
- lab(26.73 4.08 -19.5)
- LCH
- lch(26.73 19.92 281.8)
- CMYK
- cmyk(40% 33% 0% 64%)
ティント · シェード · トーン
ティント
- 494F6C
- 5B617C
- 6E738B
- 81869B
- 9599AB
- A9ADBC
- BEC1CC
- D3D5DD
- E9EAEE
シェード
- 2F3550
- 272B43
- 1F2337
- 171A2A
- 0F121F
- 080A14
- 04040A
- 010103
- 000000
トーン
- 3F4461
- 454B64
- 4C5168
- 53586B
- 5B5E6F
- 626572
- 696C76
- 717279
- 78797D
カラーハーモニー
補色 +180°
- 383E5D
Mangosteen
- 49401D
≈ Avocado Stone
類似色 -30° +30°
- 383E5D
Mangosteen
- 27435B
≈ Reef Resort
- 473957
≈ Purple Plumeria
トライアド +120° +240°
- 383E5D
Mangosteen
- 59362D
≈ Terra Brun
- 274934
≈ County Green
スプリットコンプリメンタリー +150° +210°
- 383E5D
Mangosteen
- 543A20
≈ Kuro Brown
- 3A4525
≈ Avocado Dark Green
テトラード +90° +180° +270°
- 383E5D
Mangosteen
- 59343C
≈ Fig
- 49401D
≈ Avocado Stone
- 174A44
≈ Country Squire
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 10.42:1 · APCA Lc 94
Ag
Fail黒の上
WCAG 2.01:1 · APCA Lc 8
最適な文字色: #FFFFFF
WCAG 10.42:1 (AAA) · APCA Lc 94
Contrast pairs
コードスニペット
CSS
:root {
--mangosteen: #383e5d;
--mangosteen-rgb: 56 62 93;
--mangosteen-oklch: oklch(0.373 0.054 275.1);
}
.element {
color: var(--mangosteen);
background-color: hsl(230 25% 29%);
border-color: oklch(0.373 0.054 275.1);
}Tailwind CSS v4
@theme {
--color-mangosteen: #383e5d;
--color-mangosteen-50: #f1f4ff;
--color-mangosteen-100: #e3e7fa;
--color-mangosteen-200: #ced3ec;
--color-mangosteen-300: #b0b5d3;
--color-mangosteen-400: #959cbf;
--color-mangosteen-500: #7b84aa;
--color-mangosteen-600: #697090;
--color-mangosteen-700: #535973;
--color-mangosteen-800: #3c4155;
--color-mangosteen-900: #292d3c;
--color-mangosteen-950: #171a25;
}SCSS
$mangosteen: #383e5d;
$mangosteen-rgb: 56, 62, 93;
$mangosteen-light: mix(#fff, $mangosteen, 20%);
$mangosteen-dark: mix(#000, $mangosteen, 20%);
.element {
color: $mangosteen;
box-shadow: 0 0 0 2px rgba($mangosteen, 0.35);
}