最も近い色名 · #34AE7B
#34AE7B
最も近い色名: Jubilant Jade
#34AE7B（rgb(52 174 123)、hsl(155 54% 44%)、oklch(0.671 0.131 161.1)）に最も近い色名はJubilant Jadeです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#34AE7B
oklch(0.671 0.131 161.1)
カラー変換
- HEX
- #34ae7b
- RGB
- rgb(52 174 123)
- HSL
- hsl(155 54% 44%)
- HWB
- hwb(155 20% 32%)
- OKLCH
- oklch(0.671 0.131 161.1)
- OKLab
- oklab(0.671 -0.124 0.042)
- CIE Lab
- lab(63.6 -44.03 16.17)
- LCH
- lch(63.6 46.91 159.8)
- CMYK
- cmyk(70% 0% 29% 32%)
ティント · シェード · トーン
ティント
- 51B688
- 68BF94
- 7DC7A1
- 91CFAE
- A4D7BB
- B6DFC9
- C9E7D6
- DBEFE4
- EDF7F1
シェード
- 2C976A
- 24805A
- 1C6A4A
- 15553A
- 0E412C
- 072E1E
- 031C10
- 010B05
- 000101
トーン
- 43AA7C
- 4EA57C
- 57A17D
- 5F9C7D
- 66987E
- 6D937E
- 728E7F
- 778A7F
- 7C8580
カラーハーモニー
補色 +180°
- 34AE7B
Jubilant Jade
- CB73AD
≈ Sky Magenta
類似色 -30° +30°
- 34AE7B
Jubilant Jade
- 78A64A
≈ Greenery
- 00ACA7
≈ Teal Me No Lies
トライアド +120° +240°
- 34AE7B
Jubilant Jade
- 888AE4
≈ Perrywinkle
- D87753
≈ Peachy Scene
スプリットコンプリメンタリー +150° +210°
- 34AE7B
Jubilant Jade
- B07DD1
≈ Lavender Blossom
- D97181
≈ Strawberry Milkshake
テトラード +90° +180° +270°
- 34AE7B
Jubilant Jade
- 539AE3
≈ Flax Flower Blue
- CB73AD
≈ Sky Magenta
- C78626
≈ Gentleman’s Whiskey
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.80:1 · APCA Lc 54
Ag
AAA黒の上
WCAG 7.48:1 · APCA Lc 48
最適な文字色: #000000
WCAG 7.48:1 (AAA) · APCA Lc 48
Contrast pairs
コードスニペット
CSS
:root {
--jubilant-jade: #34ae7b;
--jubilant-jade-rgb: 52 174 123;
--jubilant-jade-oklch: oklch(0.671 0.131 161.1);
}
.element {
color: var(--jubilant-jade);
background-color: hsl(155 54% 44%);
border-color: oklch(0.671 0.131 161.1);
}Tailwind CSS v4
@theme {
--color-jubilant-jade: #34ae7b;
--color-jubilant-jade-50: #d4ffeb;
--color-jubilant-jade-100: #c1f6dc;
--color-jubilant-jade-200: #a0e6c4;
--color-jubilant-jade-300: #73cda4;
--color-jubilant-jade-400: #48b685;
--color-jubilant-jade-500: #00a069;
--color-jubilant-jade-600: #008759;
--color-jubilant-jade-700: #006c47;
--color-jubilant-jade-800: #045031;
--color-jubilant-jade-900: #043721;
--color-jubilant-jade-950: #002211;
}SCSS
$jubilant-jade: #34ae7b;
$jubilant-jade-rgb: 52, 174, 123;
$jubilant-jade-light: mix(#fff, $jubilant-jade, 20%);
$jubilant-jade-dark: mix(#000, $jubilant-jade, 20%);
.element {
color: $jubilant-jade;
box-shadow: 0 0 0 2px rgba($jubilant-jade, 0.35);
}