色名 · #456252
Mission Jewel
Mission Jewelは#456252：rgb(69 98 82)、hsl(147 17% 33%)、oklch(0.468 0.043 160)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Green mean? → · Mission Jewel color name →
#456252
oklch(0.468 0.043 160)
カラー変換
- HEX
- #456252
- RGB
- rgb(69 98 82)
- HSL
- hsl(147 17% 33%)
- HWB
- hwb(147 27% 62%)
- OKLCH
- oklch(0.468 0.043 160)
- OKLab
- oklab(0.468 -0.04 0.015)
- CIE Lab
- lab(38.88 -13.99 5.53)
- LCH
- lch(38.88 15.04 158.4)
- CMYK
- cmyk(30% 0% 16% 62%)
ティント · シェード · トーン
ティント
- 567062
- 687F72
- 798E82
- 8C9E93
- 9EADA4
- B1BDB6
- C4CDC8
- D7DEDA
- EBEEEC
シェード
- 3B5446
- 31473B
- 273A2F
- 1E2D25
- 15211A
- 0C1611
- 050B08
- 020302
- 000000
トーン
- 4B6556
- 51685B
- 576B5F
- 5D6E64
- 637169
- 69746D
- 6E7772
- 747A77
- 7A7D7B
カラーハーモニー
補色 +180°
- 456252
Mission Jewel
- 6B5162
≈ Dynamic
類似色 -30° +30°
- 456252
Mission Jewel
- 525F46
≈ Mossy Bronze
- 3D6260
≈ Moor Pond Green
トライアド +120° +240°
- 456252
Mission Jewel
- 555872
≈ Nightshade Purple
- 705248
≈ Bigfoot
スプリットコンプリメンタリー +150° +210°
- 456252
Mission Jewel
- 62546D
≈ Rich Texture
- 705055
≈ Night Romance
テトラード +90° +180° +270°
- 456252
Mission Jewel
- 485C72
≈ Bluster Blue
- 6B5162
≈ Dynamic
- 6A5640
≈ Burley Wood
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 6.72:1 · APCA Lc 83
Ag
Fail黒の上
WCAG 3.12:1 · APCA Lc 19
最適な文字色: #FFFFFF
WCAG 6.72:1 (AA) · APCA Lc 83
Contrast pairs
コードスニペット
CSS
:root {
--mission-jewel: #456252;
--mission-jewel-rgb: 69 98 82;
--mission-jewel-oklch: oklch(0.468 0.043 160);
}
.element {
color: var(--mission-jewel);
background-color: hsl(147 17% 33%);
border-color: oklch(0.468 0.043 160);
}Tailwind CSS v4
@theme {
--color-mission-jewel: #456252;
--color-mission-jewel-50: #ebf9f1;
--color-mission-jewel-100: #dcede3;
--color-mission-jewel-200: #c5dacf;
--color-mission-jewel-300: #a5bfb1;
--color-mission-jewel-400: #89a796;
--color-mission-jewel-500: #6e8f7c;
--color-mission-jewel-600: #5d7969;
--color-mission-jewel-700: #4a6154;
--color-mission-jewel-800: #36473d;
--color-mission-jewel-900: #25312a;
--color-mission-jewel-950: #131d17;
}SCSS
$mission-jewel: #456252;
$mission-jewel-rgb: 69, 98, 82;
$mission-jewel-light: mix(#fff, $mission-jewel, 20%);
$mission-jewel-dark: mix(#000, $mission-jewel, 20%);
.element {
color: $mission-jewel;
box-shadow: 0 0 0 2px rgba($mission-jewel, 0.35);
}