最も近い色名 · #CC9AA5
#CC9AA5
最も近い色名: Young at Heart
#CC9AA5（rgb(204 154 165)、hsl(347 33% 70%)、oklch(0.736 0.061 4.1)）に最も近い色名はYoung at Heartです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#CC9AA5
oklch(0.736 0.061 4.1)
カラー変換
- HEX
- #cc9aa5
- RGB
- rgb(204 154 165)
- HSL
- hsl(347 33% 70%)
- HWB
- hwb(347 60% 20%)
- OKLCH
- oklch(0.736 0.061 4.1)
- OKLab
- oklab(0.736 0.061 0.004)
- CIE Lab
- lab(68.67 20.46 1.9)
- LCH
- lch(68.67 20.55 5.3)
- CMYK
- cmyk(0% 25% 19% 20%)
ティント · シェード · トーン
ティント
- D1A4AE
- D7AEB6
- DCB8BF
- E1C2C8
- E6CCD1
- EBD6DA
- F0E0E3
- F5EAEC
- FAF5F6
シェード
- B1858F
- 977179
- 7E5E65
- 654B51
- 4E393D
- 37272B
- 22171A
- 0F090A
- 020101
トーン
- C497A1
- BD959D
- B5929A
- AE9096
- A68D92
- 9E8B8F
- 97888B
- 8F8587
- 888384
カラーハーモニー
補色 +180°
- CC9AA5
Young at Heart
- 7DB7AE
≈ Winter Surf
類似色 -30° +30°
- CC9AA5
Young at Heart
- C29CBA
≈ Lupine
- CD9C90
≈ Artefact
トライアド +120° +240°
- CC9AA5
Young at Heart
- A1B186
≈ Easy Green
- 89AFCE
≈ Ocean Bubble
スプリットコンプリメンタリー +150° +210°
- CC9AA5
Young at Heart
- 8CB698
≈ Garden View
- 7CB4C1
≈ Culinary Blue
テトラード +90° +180° +270°
- CC9AA5
Young at Heart
- B6AA7E
≈ Fresh Brew
- 7DB7AE
≈ Winter Surf
- 9DA7D1
≈ Bright Bluebell
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.40:1 · APCA Lc 47
Ag
AAA黒の上
WCAG 8.73:1 · APCA Lc 55
最適な文字色: #000000
WCAG 8.73:1 (AAA) · APCA Lc 55
Contrast pairs
コードスニペット
CSS
:root {
--young-at-heart: #cc9aa5;
--young-at-heart-rgb: 204 154 165;
--young-at-heart-oklch: oklch(0.736 0.061 4.1);
}
.element {
color: var(--young-at-heart);
background-color: hsl(347 33% 70%);
border-color: oklch(0.736 0.061 4.1);
}Tailwind CSS v4
@theme {
--color-young-at-heart: #cc9aa5;
--color-young-at-heart-50: #ffeef2;
--color-young-at-heart-100: #fbe0e5;
--color-young-at-heart-200: #edcad0;
--color-young-at-heart-300: #d4abb2;
--color-young-at-heart-400: #bf909a;
--color-young-at-heart-500: #a97581;
--color-young-at-heart-600: #8f636d;
--color-young-at-heart-700: #734f57;
--color-young-at-heart-800: #553a41;
--color-young-at-heart-900: #3b272c;
--color-young-at-heart-950: #25151a;
}SCSS
$young-at-heart: #cc9aa5;
$young-at-heart-rgb: 204, 154, 165;
$young-at-heart-light: mix(#fff, $young-at-heart, 20%);
$young-at-heart-dark: mix(#000, $young-at-heart, 20%);
.element {
color: $young-at-heart;
box-shadow: 0 0 0 2px rgba($young-at-heart, 0.35);
}