色名 · #F5FFFA
Mint Cream
Mint Creamは#F5FFFA：rgb(245 255 250)、hsl(150 100% 98%)、oklch(0.991 0.012 164.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Mint Cream color name →
#F5FFFA
oklch(0.991 0.012 164.8)
カラー変換
- HEX
- #f5fffa
- RGB
- rgb(245 255 250)
- HSL
- hsl(150 100% 98%)
- HWB
- hwb(150 96% 0%)
- OKLCH
- oklch(0.991 0.012 164.8)
- OKLab
- oklab(0.991 -0.012 0.003)
- CIE Lab
- lab(99.14 -4.06 1.2)
- LCH
- lch(99.14 4.24 163.6)
- CMYK
- cmyk(4% 0% 2% 0%)
ティント · シェード · トーン
ティント
- F6FFFA
- F7FFFB
- F8FFFB
- F9FFFC
- FAFFFC
- FBFFFD
- FCFFFD
- FDFFFE
- FEFFFE
シェード
- D5DED9
- B6BEBA
- 989E9B
- 7B807D
- 5F6361
- 444846
- 2B2E2D
- 151615
- 030303
トーン
- E9F2ED
- DDE4E0
- D0D7D4
- C5CAC7
- B9BEBB
- ADB1AF
- A2A4A3
- 969897
- 8B8C8B
カラーハーモニー
補色 +180°
- F5FFFA
Mint Cream
- FFFBFD
≈ Flawed White
類似色 -30° +30°
- F5FFFA
Mint Cream
- F9FEF6
≈ Touch of Mint
- F3FFFF
≈ Sparkling Snow
トライアド +120° +240°
- F5FFFA
Mint Cream
- FCFCFF
≈ Pale Grey
- FFFBFA
≈ Snow
スプリットコンプリメンタリー +150° +210°
- F5FFFA
Mint Cream
- FEFBFF
≈ Flawed White
- FFFBFB
≈ Flawed White
テトラード +90° +180° +270°
- F5FFFA
Mint Cream
- FAFCFF
≈ Wash Me
- FFFBFD
≈ Flawed White
- FFFCF7
≈ Eyeball
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.02:1 · APCA Lc 0
Ag
AAA黒の上
WCAG 20.56:1 · APCA Lc 106
最適な文字色: #000000
WCAG 20.56:1 (AAA) · APCA Lc 106
Contrast pairs
コードスニペット
CSS
:root {
--mint-cream: #f5fffa;
--mint-cream-rgb: 245 255 250;
--mint-cream-oklch: oklch(0.991 0.012 164.8);
}
.element {
color: var(--mint-cream);
background-color: hsl(150 100% 98%);
border-color: oklch(0.991 0.012 164.8);
}Tailwind CSS v4
@theme {
--color-mint-cream: #f5fffa;
--color-mint-cream-50: #f2f6f4;
--color-mint-cream-100: #e4e9e7;
--color-mint-cream-200: #cfd6d3;
--color-mint-cream-300: #b2b9b6;
--color-mint-cream-400: #98a19c;
--color-mint-cream-500: #7f8984;
--color-mint-cream-600: #6c7470;
--color-mint-cream-700: #565d59;
--color-mint-cream-800: #3f4441;
--color-mint-cream-900: #2b2f2d;
--color-mint-cream-950: #181b1a;
}SCSS
$mint-cream: #f5fffa;
$mint-cream-rgb: 245, 255, 250;
$mint-cream-light: mix(#fff, $mint-cream, 20%);
$mint-cream-dark: mix(#000, $mint-cream, 20%);
.element {
color: $mint-cream;
box-shadow: 0 0 0 2px rgba($mint-cream, 0.35);
}