Màu hồng: bảng mã màu, ý nghĩa và cách phối trong thiết kế
Mục lục
Bảng 14 sắc hồng kèm mã HEX, RGB (hồng phấn, hồng pastel, hồng đất, hồng cánh sen, các tên màu CSS), màu hồng pha từ màu gì, ý nghĩa và điều nghiên cứu thật sự nói, màu hồng hợp với màu gì, chữ nào đọc được trên nền hồng theo WCAG, 5 hướng phối màu và lưu ý khi in.
Trả lời nhanh: màu hồng là một màu đỏ đã được làm sáng lên. Pha sơn thì là đỏ thêm trắng; trên màn hình là kênh đỏ để cao, hai kênh xanh lá và xanh dương nâng lên theo. "Màu hồng" không phải một mã màu duy nhất mà là cả một dải, từ hồng phấn rất nhạt tới hồng cánh sen rất đậm. Bảng dưới đây là 14 sắc hồng hay được tìm nhất, kèm mã HEX và RGB để bạn chép dùng ngay.
| Tên màu | HEX | RGB | Hợp dùng cho |
|---|---|---|---|
| Hồng baby | #FFD1DC | 255, 209, 220 | Nền nhẹ cho đồ trẻ em, thiệp, mỹ phẩm |
| Hồng phấn | #F6C6D0 | 246, 198, 208 | Nền bao bì, bài đăng làm đẹp, đám cưới |
| Hồng pastel | #FADADD | 250, 218, 221 | Nền trang web, slide, khoảng nghỉ trong bố cục |
| Be hồng | #E8C7B8 | 232, 199, 184 | Màu trung tính ấm thay cho be và xám |
| Hồng đào | #FFB7A5 | 255, 183, 165 | Đồ ăn uống, minh hoạ mùa hè |
| Hồng san hô | #F88379 | 248, 131, 121 | Màu nhấn ấm, nút bấm trên nền tối |
| Hồng ruốc | #D98C95 | 217, 140, 149 | Thời trang, lookbook, ảnh sản phẩm |
| Hồng đất | #C8877F | 200, 135, 127 | Thương hiệu tối giản, gốm, nội thất |
| Hồng cánh sen (magenta) | #FF00FF | 255, 0, 255 | Màu nhấn rất rực trên màn hình, tiêu đề lớn |
| Hồng neon | #FF3EA5 | 255, 62, 165 | Sự kiện, âm nhạc, chỉ dùng trên màn hình |
| pink (CSS) | #FFC0CB | 255, 192, 203 | Mảng nền, thẻ, nhãn |
| lightpink (CSS) | #FFB6C1 | 255, 182, 193 | Mảng nền đậm hơn pink một nấc |
| hotpink (CSS) | #FF69B4 | 255, 105, 180 | Màu nhấn, hình minh hoạ, nền có chữ đen |
| deeppink (CSS) | #FF1493 | 255, 20, 147 | Điểm nhấn rất mạnh, dùng ít |
Mười tên tiếng Việt là tên gọi phổ biến, không có chuẩn nào quy định mã: mã trong bảng là màu đại diện do ColorME chọn, mỗi nơi có thể lệch một chút. Riêng hồng cánh sen mình dùng đúng mã magenta #FF00FF của CSS, thống nhất với bài màu tương phản. Bốn dòng có chữ CSS là tên màu chính thức của web, mã lấy từ mục Named Colors trong CSS Color Module Level 4 của W3C, đọc ngày 14/10/2026.
Mười bốn sắc hồng trong bảng trên, xếp từ nhạt tới đậm. Mã của các tên tiếng Việt là màu đại diện do ColorME chọn; bốn tên CSS và mã magenta của hồng cánh sen theo W3C. Hình do ColorME tự dựng.
Bảng màu hồng theo nhóm: pastel, hồng đất và hồng đậm
Khi cần chọn nhanh, mình chia các sắc hồng thành ba nhóm theo độ sáng và độ bão hoà.
- Bảng màu hồng pastel (hồng nhạt): hồng pastel #FADADD, hồng baby #FFD1DC, hồng phấn #F6C6D0, pink #FFC0CB, lightpink #FFB6C1. Các màu này rất sáng (độ sáng 86 đến 92% theo HSL), hợp làm nền, không hợp làm chữ.
- Nhóm hồng đất, hồng trầm: be hồng #E8C7B8, hồng ruốc #D98C95, hồng đất #C8877F, và hồng khói #CFA5AE nếu bạn cần một màu ngả xám. Độ bão hoà chỉ 30 đến 51% nên nhìn dịu, hợp phong cách tối giản.
- Nhóm hồng đậm, hồng rực: hồng san hô #F88379, hồng dâu #F2617A, hotpink #FF69B4, hồng neon #FF3EA5, deeppink #FF1493, hồng cánh sen #FF00FF, hồng tím #C850A0. Dùng làm màu nhấn hoặc màu chủ đạo.
Ngoài bốn tên đã nêu, CSS còn ba tên thuộc họ hồng: palevioletred #DB7093, mediumvioletred #C71585, và fuchsia cùng magenta là hai tên của một mã #FF00FF, tức hồng cánh sen trong bảng trên. Bạn gõ thẳng các tên này vào CSS, không cần nhớ mã; ở các phần mềm thiết kế thì dán mã HEX vào ô chọn màu.
Màu hồng là sự kết hợp của màu gì?
Câu trả lời tuỳ bạn đang pha bằng gì:
- Pha màu vẽ, sơn: đỏ thêm trắng. Càng nhiều trắng càng ra hồng phấn; thêm một chút vàng thì ngả hồng đào, thêm một chút xanh dương hoặc tím thì ngả hồng tím.
- Trên màn hình (RGB): màn hình trộn ánh sáng đỏ, xanh lá, xanh dương, mỗi kênh từ 0 đến 255. Hồng là khi kênh đỏ ở mức cao còn hai kênh kia được nâng lên. Ví dụ pink của CSS là 255, 192, 203; hotpink là 255, 105, 180. Hạ hai kênh sau xuống thì hồng đậm dần về phía đỏ; đẩy kênh xanh dương lên cao thì hồng ngả sang magenta 255, 0, 255.
- Khi in (CMYK): ở đây magenta không phải màu pha ra, nó là một trong các mực gốc. Adobe mô tả CMYK là mô hình màu trừ dựa trên ba mực cyan, magenta, yellow và thêm mực đen. Vì vậy màu hồng trên giấy chủ yếu là mực magenta in thưa, thêm chút yellow nếu là hồng ấm.
Vì sao vòng màu của hoạ sĩ và của màn hình khác nhau, mình đã viết ở bài vòng tròn màu sắc; còn cách đọc mã CMYK và RGB thì có ở bài hệ màu CMYK và RGB.
Cùng là màu hồng nhưng ba cách tạo: đỏ pha trắng khi vẽ, ba kênh ánh sáng trên màn hình, mực magenta khi in. Giá trị RGB theo W3C CSS Color 4. Hình do ColorME tự dựng.
Ý nghĩa màu hồng và tâm lý màu sắc: điều gì nói được chắc?
Ở Việt Nam và nhiều nơi khác hiện nay, màu hồng thường được gắn với sự dịu dàng, lãng mạn, tuổi trẻ, sự chăm sóc và những dịp như cưới hỏi, lễ tình nhân. Hồng nhạt hay được đọc là nhẹ nhàng, ngọt ngào; hồng đậm và hồng neon là tinh nghịch, nổi loạn, sôi động; hồng đất là trưởng thành, ấm, kín đáo. Đó là liên tưởng văn hoá mà người xem mang sẵn, thay đổi theo nơi chốn và thời kỳ, chứ không phải phản ứng cố định của bộ não trước một bước sóng.
Về phần "tâm lý", ví dụ hay được nhắc là màu Baker-Miller pink, từng được cho là làm người ta dịu lại. Mình chỉ đọc được phần tóm tắt của hai nghiên cứu, và chúng không nói cùng một điều:
- Profusek và Rainey (1987, tạp chí Perceptual and Motor Skills) cho 46 sinh viên ngồi 5 phút trong phòng sơn đỏ hoặc sơn hồng Baker-Miller. Nhóm phòng hồng có mức lo âu tức thời thấp hơn, nhưng lực nắm tay và độ chính xác vận động không khác; các tác giả gọi đây là sự ủng hộ "tối thiểu" cho giả thuyết. Nguồn: tóm tắt trên PubMed.
- Genschow và cộng sự (công bố trực tuyến cuối 2014, tạp chí Psychology, Crime & Law) làm một thí nghiệm có kiểm soát chặt hơn về hành vi hung hăng và viết rằng kết quả không lặp lại được phát hiện ban đầu. Bài báo: doi.org/10.1080/1068316X.2014.989172; mình đọc phần tóm tắt qua chỉ mục OpenAlex, chưa đọc toàn văn.
Vì thế mình không viết "màu hồng làm giảm căng thẳng" như một sự thật. Với người làm thiết kế, cách dùng chắc tay hơn là hỏi: nhóm khách hàng này đang quen thấy màu hồng ở đâu, và sắc hồng nào đúng với giọng của thương hiệu.
Màu hồng hợp với màu gì?
Mình lấy hotpink #FF69B4 làm màu gốc rồi xoay sắc màu trên vòng RGB bằng một đoạn mã nhỏ (giữ nguyên độ bão hoà và độ sáng). Đây là màu thuần theo công thức; khi dùng thật nên hạ độ bão hoà của các màu phụ.
| Kiểu phối | Mã màu | Cảm giác |
|---|---|---|
| Bổ sung | #FF69B4, #69FFB4 | Hồng với xanh lá bạc hà: tương phản mạnh nhất |
| Bổ sung chia tách | #FF69B4, #69FF69, #69FFFF | Hồng với xanh lá và xanh ngọc: vẫn nổi, bớt gắt |
| Tương đồng | #FF69FF, #FF69B4, #FF6969 | Tím hồng, hồng, đỏ san hô: êm, liền mạch |
| Bộ ba | #FF69B4, #B4FF69, #69B4FF | Hồng, xanh nõn chuối, xanh da trời: vui, trẻ |
| Đơn sắc | #FFD6EB, #FFA3D1, #FF69B4, #C32273, #5A1638 | Một sắc hồng, năm độ sáng: an toàn nhất |
Ngoài vòng màu, hồng rất hợp với các màu trung tính: trắng, kem, xám ấm, be, nâu, đen, và xanh navy. Trung tính làm nền, hồng làm điểm nhấn là cách ít rủi ro nhất cho người mới. Các sắc xanh hay đi cùng hồng trong bảng trên (xanh mint, xanh nõn chuối, xanh da trời) và xanh navy đều có mã trong bài màu xanh. Bạn có thể tự xoay các bộ này trên Bánh xe màu của ColorME; trang công cụ ghi có "8 lựa chọn: tương đồng, đơn sắc, bộ ba, bổ sung, bổ sung chia tách, ghép đôi (hai cặp màu bổ sung), sắc độ (cùng màu khác độ sáng) và tuỳ chỉnh" và cho nhập mã HEX làm màu gốc. Nếu bạn có sẵn một bức ảnh tông hồng ưng ý, Trích xuất bảng màu cho "chọn 4, 6, 8 hoặc 10 màu chủ đạo" từ ảnh.
Năm kiểu phối từ màu gốc hotpink #FF69B4, tính bằng cách xoay sắc màu trên vòng RGB. Hình do ColorME tự dựng.
Chữ trên nền hồng: cặp nào đọc được?
Đây là lỗi mình gặp nhiều nhất ở thiết kế tông hồng: chữ trắng trên nền hồng. WCAG của W3C yêu cầu chữ thường có tỉ lệ tương phản với nền ít nhất 4.5:1, chữ lớn ít nhất 3:1. Mình tính các cặp dưới đây bằng công thức độ chói tương đối trong tài liệu kỹ thuật G17 của W3C, cắt bỏ số lẻ sau hai chữ số chứ không làm tròn lên.
| Nền | Chữ trắng #FFFFFF | Chữ gần đen #121212 | Chữ mận đậm #4A1230 |
|---|---|---|---|
| Hồng baby #FFD1DC | 1.36:1, không đạt | 13.74:1, đạt | 10.84:1, đạt |
| pink #FFC0CB | 1.53:1, không đạt | 12.18:1, đạt | 9.61:1, đạt |
| Hồng đất #C8877F | 2.90:1, không đạt | 6.44:1, đạt | 5.08:1, đạt |
| hotpink #FF69B4 | 2.64:1, không đạt | 7.07:1, đạt | 5.58:1, đạt |
| deeppink #FF1493 | 3.63:1, chỉ chữ lớn | 5.15:1, đạt | 4.06:1, chỉ chữ lớn |
| Hồng cánh sen #FF00FF | 3.13:1, chỉ chữ lớn | 5.97:1, đạt | 4.71:1, đạt |
| mediumvioletred #C71585 | 5.42:1, đạt | 3.45:1, chỉ chữ lớn | 2.72:1, không đạt |
Ba điều rút ra từ bảng:
- Trong bảy nền hồng này, chữ trắng chỉ đạt 4.5:1 trên một màu: mediumvioletred #C71585. Trên hồng phấn, hồng đất, hotpink, hãy dùng chữ tối.
- Chữ gần đen đạt trên sáu trong bảy nền. Nếu thấy đen quá cứng, mận đậm #4A1230 vẫn đạt trên các nền sáng.
- Chiều ngược lại, chữ hồng trên nền trắng gần như không dùng được cho chữ nhỏ: hotpink chỉ 2.64:1, deeppink 3.63:1. Muốn chữ hồng, đặt nó lên nền tối: hotpink trên #121212 đạt 7.07:1, pink trên mận đậm đạt 9.61:1.
Với cặp màu của riêng bạn, dán hai mã vào Kiểm tra độ tương phản. Trang công cụ ghi: "Miễn phí, không cần đăng nhập và chạy ngay trên trình duyệt máy tính lẫn điện thoại." Phần lý thuyết về các kiểu tương phản nằm ở bài màu tương phản.
Tỉ lệ tương phản của chữ trắng, chữ gần đen và chữ mận đậm trên bảy nền hồng, tính theo công thức WCAG của W3C. Từ 4.5:1 là đạt cho chữ thường. Hình do ColorME tự dựng.
5 hướng phối màu hồng trong thiết kế
Năm bảng bốn màu dưới đây do mình chọn và đã đo tương phản cho cặp chữ chính.
| Hướng | Bốn màu | Cặp chữ và nền nên dùng | Hợp với |
|---|---|---|---|
| Pastel dịu | #FFD1DC, #FADADD, #B8D8C8, #4A1230 | Chữ #4A1230 trên #FFD1DC: 10.84:1 | Mỹ phẩm, đồ trẻ em, thiệp, tiệm bánh |
| Hồng đất tối giản | #C8877F, #E8C7B8, #F5EFE9, #2B2523 | Chữ #2B2523 trên #F5EFE9: 13.22:1 | Gốm, nội thất, thời trang, spa |
| Hồng neon năng động | #FF3EA5, #1F3FE0, #FFE14A, #121212 | Chữ #121212 trên #FF3EA5: 5.78:1 | Sự kiện, âm nhạc, ứng dụng cho giới trẻ |
| Hồng và đen sang trọng | #F6C6D0, #121212, #C8877F, #FFFFFF | Chữ #F6C6D0 trên #121212: 12.40:1 | Trang sức, nước hoa, danh thiếp |
| Hồng và xanh lá cổ điển | #FF69B4, #14532D, #F7EFE2, #FFC0CB | Chữ #FFC0CB trên #14532D: 5.92:1 | Hoa, trà, bao bì thực phẩm, lễ hội |
Vài lưu ý khi áp dụng:
- Pastel dịu: hồng baby và xanh bạc hà nhạt gần như cùng độ sáng (1.12:1), nên chỉ dùng chúng làm mảng nền cạnh nhau, đừng đặt chữ màu này lên màu kia.
- Hồng đất: hồng đất làm mảng lớn hoặc hình khối; chữ nhỏ để màu nâu đen #2B2523. Chữ hồng đất trên nền kem chỉ 2.54:1.
- Hồng neon: hồng neon cạnh xanh cobalt chỉ 2.27:1, hai màu sẽ rung mắt nếu chữ nhỏ. Tách chúng bằng một dải đen hoặc vàng.
- Hồng và đen: để đen chiếm phần lớn diện tích, hồng phấn chỉ làm chữ và nét mảnh thì ra vẻ sang; đảo tỉ lệ lại sẽ ra vẻ ngọt.
- Hồng và xanh lá: cặp bổ sung quen thuộc từ hoa lá. Chữ hotpink trên xanh rêu chỉ 3.44:1 (chỉ hợp chữ lớn), nên chữ nhỏ dùng pink #FFC0CB hoặc kem.
Ba hướng đầu trên ba sản phẩm mẫu: nhãn hũ kem dưỡng tông pastel, danh thiếp hồng đất, poster đêm nhạc hồng neon. Thương hiệu giả định. Hình do ColorME tự dựng.
Hai hướng còn lại: hồng phấn trên đen cho màn hình ứng dụng trang sức, hồng với xanh rêu cho nhãn hộp trà. Thương hiệu giả định. Hình do ColorME tự dựng.
Khi một bảng màu đã chốt, nó thường đi vào key visual của chiến dịch và vào các hoạ tiết lặp trên bao bì; cách dựng hoạ tiết mình viết ở bài pattern là gì.
Màu hồng khi in: vì sao hồng neon bị xỉn?
Rắc rối khi in thường nằm ở các sắc hồng rực như hồng neon, deeppink, magenta #FF00FF. Trong hướng dẫn của Illustrator, Adobe viết rằng một số màu RGB, chẳng hạn màu neon, không in được vì không có màu tương đương trong CMYK; phần mềm sẽ đưa chúng về màu in được gần nhất, nên bản in trầm hơn.
Mình khuyên bật cảnh báo ngoài gam màu khi chọn hồng cho ấn phẩm và in thử một tờ trước khi chốt. Nếu thương hiệu buộc phải có hồng rực trên giấy, hãy hỏi nhà in về mực pha sẵn. Mình không đưa bảng quy đổi CMYK cho từng sắc hồng vì con số phụ thuộc profile và giấy của từng nhà in.
Câu hỏi thường gặp về màu hồng
Mã màu hồng là gì?
Không có một mã duy nhất. Tên pink trong CSS là #FFC0CB (RGB 255, 192, 203). Hồng đậm hay dùng là hotpink #FF69B4 và deeppink #FF1493.
Hồng pastel mã màu bao nhiêu, dùng trong Canva thế nào?
Mình hay dùng #FADADD, #FFD1DC và #F6C6D0. Đây là màu đại diện, bạn chỉnh sáng tối tuỳ thiết kế.
Màu be hồng là màu gì?
Là màu be có ánh hồng, ví dụ #E8C7B8. Nó thuộc nhóm trung tính ấm, đi được với gần như mọi sắc hồng khác và với nâu, kem, trắng.
Hồng cánh sen là mã nào?
Trong bài này và bài màu tương phản của ColorME, hồng cánh sen là magenta #FF00FF (RGB 255, 0, 255), màu nằm đối diện xanh lá trên vòng RGB. Ngoài đời, tên này còn được dùng cho nhiều sắc hồng đậm ngả tím khác. Khi trao đổi với khách hoặc nhà in, hãy gửi mã chứ đừng chỉ gửi tên.
Màu hồng hợp với màu gì nhất?
An toàn nhất là các màu trung tính: trắng, kem, be, xám ấm, đen. Muốn nổi bật thì dùng màu bổ sung là xanh lá (hồng nhạt với xanh rêu đậm #14532D đạt 5.92:1). Muốn êm thì phối đơn sắc, tức nhiều độ sáng của cùng một sắc hồng.
Nguồn đã đọc ngày 14/10/2026: W3C (CSS Color Module Level 4; WCAG 2.2 Understanding SC 1.4.3; Technique G17), Adobe (Understand color modes; Make colors printable or web safe), tóm tắt hai nghiên cứu trên PubMed và OpenAlex. Các tỉ lệ tương phản và bảng phối màu do ColorME tự tính.
