最も近い色名 · #F2C4B9
#F2C4B9
最も近い色名: Rosewood Dreams
#F2C4B9（rgb(242 196 185)、hsl(12 69% 84%)、oklch(0.858 0.055 33.7)）に最も近い色名はRosewood Dreamsです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#F2C4B9
oklch(0.858 0.055 33.7)
カラー変換
- HEX
- #f2c4b9
- RGB
- rgb(242 196 185)
- HSL
- hsl(12 69% 84%)
- HWB
- hwb(12 73% 5%)
- OKLCH
- oklch(0.858 0.055 33.7)
- OKLab
- oklab(0.858 0.046 0.031)
- CIE Lab
- lab(83.06 15.71 12.07)
- LCH
- lch(83.06 19.81 37.5)
- CMYK
- cmyk(0% 19% 24% 5%)
ティント · シェード · トーン
ティント
- F4CAC0
- F5D0C7
- F7D6CE
- F8DCD5
- F9E1DC
- FBE7E3
- FCEDEA
- FDF3F1
- FEF9F8
シェード
- D2AAA0
- B49189
- 967871
- 79615B
- 5E4A46
- 433531
- 2B211E
- 140E0D
- 030202
トーン
- E6BDB3
- DAB6AD
- CFAFA8
- C3A8A2
- B8A29C
- AD9B96
- A19491
- 968D8B
- 8B8786
カラーハーモニー
補色 +180°
- F2C4B9
Rosewood Dreams
- A7DAE6
≈ Havana Blue
類似色 -30° +30°
- F2C4B9
Rosewood Dreams
- F1C2CC
≈ Azalea Flower
- EBC9AB
≈ Almond Biscuit
トライアド +120° +240°
- F2C4B9
Rosewood Dreams
- B5DBC0
≈ Ice Mist
- C4CEF5
≈ Miami White
スプリットコンプリメンタリー +150° +210°
- F2C4B9
Rosewood Dreams
- A8DDD4
≈ Sparkling Mint
- B2D5F2
≈ Blue Rice
テトラード +90° +180° +270°
- F2C4B9
Rosewood Dreams
- C9D7B0
≈ Chinese Leaf
- A7DAE6
≈ Havana Blue
- D8C8EE
≈ Foggy Love
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.57:1 · APCA Lc 26
Ag
AAA黒の上
WCAG 13.37:1 · APCA Lc 77
最適な文字色: #000000
WCAG 13.37:1 (AAA) · APCA Lc 77
Contrast pairs
コードスニペット
CSS
:root {
--rosewood-dreams: #f2c4b9;
--rosewood-dreams-rgb: 242 196 185;
--rosewood-dreams-oklch: oklch(0.858 0.055 33.7);
}
.element {
color: var(--rosewood-dreams);
background-color: hsl(12 69% 84%);
border-color: oklch(0.858 0.055 33.7);
}Tailwind CSS v4
@theme {
--color-rosewood-dreams: #f2c4b9;
--color-rosewood-dreams-50: #fff0eb;
--color-rosewood-dreams-100: #fae2dc;
--color-rosewood-dreams-200: #ebcdc4;
--color-rosewood-dreams-300: #d2aea4;
--color-rosewood-dreams-400: #bd9389;
--color-rosewood-dreams-500: #a7796e;
--color-rosewood-dreams-600: #8d675e;
--color-rosewood-dreams-700: #71524b;
--color-rosewood-dreams-800: #543b37;
--color-rosewood-dreams-900: #3a2925;
--color-rosewood-dreams-950: #241714;
}SCSS
$rosewood-dreams: #f2c4b9;
$rosewood-dreams-rgb: 242, 196, 185;
$rosewood-dreams-light: mix(#fff, $rosewood-dreams, 20%);
$rosewood-dreams-dark: mix(#000, $rosewood-dreams, 20%);
.element {
color: $rosewood-dreams;
box-shadow: 0 0 0 2px rgba($rosewood-dreams, 0.35);
}