色名 · #F0E1DF
New Youth
New Youthは#F0E1DF：rgb(240 225 223)、hsl(7 36% 91%)、oklch(0.921 0.017 26.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · New Youth color name →
#F0E1DF
oklch(0.921 0.017 26.7)
カラー変換
- HEX
- #f0e1df
- RGB
- rgb(240 225 223)
- HSL
- hsl(7 36% 91%)
- HWB
- hwb(7 87% 6%)
- OKLCH
- oklch(0.921 0.017 26.7)
- OKLab
- oklab(0.921 0.015 0.007)
- CIE Lab
- lab(90.71 5.04 2.92)
- LCH
- lch(90.71 5.83 30.1)
- CMYK
- cmyk(0% 6% 7% 6%)
ティント · シェード · トーン
ティント
- F2E4E2
- F3E7E5
- F5EAE9
- F6EDEC
- F8F0EF
- F9F3F2
- FBF6F5
- FCF9F9
- FEFCFC
シェード
- D1C4C2
- B2A7A5
- 958B8A
- 78706F
- 5D5656
- 433E3D
- 2A2727
- 141212
- 030202
トーン
- E4D7D5
- D9CDCB
- CDC3C2
- C2B9B8
- B6AFAE
- ABA6A5
- A09C9B
- 959392
- 8B8989
カラーハーモニー
補色 +180°
- F0E1DF
New Youth
- D9E8EA
≈ Soft Blue White
類似色 -30° +30°
- F0E1DF
New Youth
- EFE1E5
≈ Pink Booties
- EEE2DA
≈ Merlin’s Beard
トライアド +120° +240°
- F0E1DF
New Youth
- DEE8DF
≈ Minified Green
- E0E5F1
≈ Crystal Falls
スプリットコンプリメンタリー +150° +210°
- F0E1DF
New Youth
- DAE9E5
≈ Snowball Effect
- DBE7EF
≈ Space Wolves Grey
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.26:1 · APCA Lc 13
Ag
AAA黒の上
WCAG 16.54:1 · APCA Lc 91
最適な文字色: #000000
WCAG 16.54:1 (AAA) · APCA Lc 91
Contrast pairs
コードスニペット
CSS
:root {
--new-youth: #f0e1df;
--new-youth-rgb: 240 225 223;
--new-youth-oklch: oklch(0.921 0.017 26.7);
}
.element {
color: var(--new-youth);
background-color: hsl(7 36% 91%);
border-color: oklch(0.921 0.017 26.7);
}Tailwind CSS v4
@theme {
--color-new-youth: #f0e1df;
--color-new-youth-50: #faf3f2;
--color-new-youth-100: #ede6e5;
--color-new-youth-200: #dbd2d0;
--color-new-youth-300: #c0b4b2;
--color-new-youth-400: #a89b99;
--color-new-youth-500: #918280;
--color-new-youth-600: #7b6e6d;
--color-new-youth-700: #625857;
--color-new-youth-800: #48403f;
--color-new-youth-900: #322c2c;
--color-new-youth-950: #1e1919;
}SCSS
$new-youth: #f0e1df;
$new-youth-rgb: 240, 225, 223;
$new-youth-light: mix(#fff, $new-youth, 20%);
$new-youth-dark: mix(#000, $new-youth, 20%);
.element {
color: $new-youth;
box-shadow: 0 0 0 2px rgba($new-youth, 0.35);
}