Kiến thức · 05/06/2025
Khám phá các loại màu cơ bản và ứng dụng của chúng trong thiết kế

Trong thiết kế, việc hiểu rõ về màu cơ bản là yếu tố nền tảng để tạo nên những sản phẩm thị giác ấn tượng và chuyên nghiệp. Dù bạn là người mới bắt đầu hay là designer lâu năm, khả năng phối màu trong thiết kế chính xác sẽ giúp bạn truyền tải thông điệp tốt hơn và định hình rõ ràng hơn phong cách của thương hiệu. Trong bài viết này, hãy cùng colorME khám phá các loại màu cơ bản và cách ứng dụng chúng hiệu quả vào thiết kế đồ họa hiện đại.
Trả lời nhanh: màu cơ bản gồm những màu nào? 24 màu cơ bản là gì?
Màu cơ bản tuỳ vào việc bạn pha thứ gì. Pha sơn, màu nước theo cách truyền thống (hệ RYB): đỏ, vàng, xanh lam. Trộn ánh sáng trên màn hình (hệ RGB): đỏ, xanh lục, xanh lam. In bằng mực (hệ CMYK): xanh lơ, hồng sen, vàng, thêm mực đen.

Màu cơ bản tuỳ vào việc bạn pha thứ gì: RYB khi vẽ, RGB trên màn hình, CMYK khi in. Mã hex theo W3C CSS Color 4. Hình do ColorME tự dựng.
Không có chuẩn màu nào quy định "24 màu cơ bản". Con số 24 thường gặp ở hộp bút màu, sáp màu hay bộ sơn, và mỗi hãng chọn một bộ khác nhau. Bên dưới có bảng 24 tên màu thường dùng kèm tên tiếng Anh và mã hex chuẩn web để bạn tra nhanh.
| Số màu | Gồm những màu | Dùng ở đâu |
|---|---|---|
| 3 màu (RYB) | Đỏ, vàng, xanh lam | Vẽ tranh, pha sơn, màu nước theo cách truyền thống |
| 3 màu (RGB) | Đỏ, xanh lục, xanh lam | Màn hình, đèn, mọi thiết kế để xem trên máy |
| 4 màu (CMYK) | Xanh lơ (cyan), hồng sen (magenta), vàng, đen | In ấn 4 màu |
| 6 màu | 3 màu cơ bản và 3 màu thứ cấp: cam, xanh lục, tím | Vòng màu 6 sắc, bài tập pha màu đầu tiên |
| 8 màu | Đen, trắng, đỏ, xanh lục, xanh lam, xanh lơ, hồng sen, vàng | 8 màu tạo ra khi mỗi kênh R, G, B chỉ nhận 0 hoặc 255 |
| 12 màu | 6 màu trên và 6 màu tam cấp | Vòng tròn màu sắc 12 màu |
| 24 màu | Không có bộ chuẩn, xem bảng 24 tên màu thường dùng bên dưới | Hộp bút màu, sáp màu, bộ sơn |
Bảng do ColorME tổng hợp ngày 15/10/2026. Hệ RGB và CMYK theo trang Understand color modes của Adobe; mã hex theo danh sách màu có tên trong CSS Color Module Level 4 của W3C.
Màu cơ bản là gì? Vì sao phải nắm rõ trước khi thiết kế?
Màu cơ bản (primary colors) là ba màu gốc gồm: đỏ, xanh lam và vàng. Đây là những màu không thể tạo ra từ sự pha trộn của các màu khác. Tuy nhiên, chúng lại là nền tảng để tạo nên mọi màu sắc khác trong hệ thống phối màu.
Khi bạn hiểu được màu cơ bản, bạn sẽ kiểm soát được quá trình phối màu trong thiết kế. Từ đó, chúng ta có thể dễ dàng chọn tone màu phù hợp cho từng dự án.
Ghi chú của ColorME (10/2026): Định nghĩa "ba màu đỏ, xanh lam, vàng không pha ra được từ màu khác" ở trên đúng với hệ màu hội hoạ truyền thống (RYB), hệ mà phần lớn bài này dùng khi nói về pha màu và phối màu. Với ánh sáng, Adobe viết: hệ RGB tạo màu bằng cách trộn ánh sáng đỏ, xanh lục và xanh lam; chồng lên nhau, chúng tạo ra xanh lơ, hồng sen và vàng, và cả ba ở cường độ tối đa cho ra màu trắng. Với mực in, hệ CMYK dùng xanh lơ, hồng sen và vàng; về lý thuyết ba mực này chồng lên nhau cho màu đen, nhưng thực tế nhà in thêm mực đen (K) để vùng tối sâu và rõ chi tiết hơn (Adobe: Understand color modes). Sự khác nhau giữa pha sơn và trộn ánh sáng được giải thích kỹ trong bài bảng pha màu: trộn màu gì ra màu gì.

Pha sơn (RYB), trộn ánh sáng (RGB) và in bằng mực (CMYK) dùng ba bộ màu cơ bản khác nhau. Phần chồng lên nhau là màu tính theo phép cộng ánh sáng và phép nhân mực. Hình do ColorME tự dựng.
24 màu cơ bản: tên tiếng Việt, tiếng Anh và mã màu
Bảng dưới gồm 3 màu cơ bản, 3 màu thứ cấp, các biến thể hay gặp và 6 màu trung tính. Cột tên tiếng Anh dùng đúng từ khoá màu trong CSS, nên bạn gõ thẳng vào code hoặc ô mã màu được. Mã hex lấy từ CSS Color Module Level 4 của W3C.
| # | Tên tiếng Việt | Tên tiếng Anh (CSS) | Mã hex | Nhóm |
|---|---|---|---|---|
| 1 | Đỏ | red | #FF0000 | Cơ bản |
| 2 | Vàng | yellow | #FFFF00 | Cơ bản |
| 3 | Xanh lam | blue | #0000FF | Cơ bản |
| 4 | Cam | orange | #FFA500 | Thứ cấp (RYB) |
| 5 | Xanh lá | green | #008000 | Thứ cấp (RYB) |
| 6 | Tím | purple | #800080 | Thứ cấp (RYB) |
| 7 | Xanh lá tươi | lime | #00FF00 | Cơ bản (RGB) |
| 8 | Xanh lơ | cyan | #00FFFF | Cơ bản (CMY) |
| 9 | Hồng sen | magenta | #FF00FF | Cơ bản (CMY) |
| 10 | Xanh navy | navy | #000080 | Biến thể lam |
| 11 | Xanh ngọc | turquoise | #40E0D0 | Biến thể lơ |
| 12 | Xanh mòng két | teal | #008080 | Biến thể lơ |
| 13 | Chàm | indigo | #4B0082 | Biến thể tím |
| 14 | Tím hoa cà | violet | #EE82EE | Biến thể tím |
| 15 | Hồng | pink | #FFC0CB | Biến thể đỏ |
| 16 | Đỏ đô | maroon | #800000 | Biến thể đỏ |
| 17 | Nâu | brown | #A52A2A | Màu đất |
| 18 | Xanh rêu | olive | #808000 | Màu đất |
| 19 | Vàng kim | gold | #FFD700 | Biến thể vàng |
| 20 | Be | beige | #F5F5DC | Trung tính ấm |
| 21 | Bạc | silver | #C0C0C0 | Trung tính |
| 22 | Xám | gray | #808080 | Trung tính |
| 23 | Đen | black | #000000 | Trung tính |
| 24 | Trắng | white | #FFFFFF | Trung tính |

Bảng 24 màu cơ bản, phần 1: màu 1 đến 12 với tên tiếng Việt, tên CSS và mã hex theo W3C CSS Color 4. Hình do ColorME tự dựng.

Bảng 24 màu cơ bản, phần 2: màu 13 đến 24. Hình do ColorME tự dựng.
Ba điều cần nhớ khi dùng bảng này:
- Đây là màu hiển thị trên màn hình. Cùng tên "đỏ" nhưng thỏi sáp, tuýp sơn của mỗi hãng sẽ khác nhau.
- Vài tên CSS không khớp cảm nhận thông thường: "green" trong CSS là xanh lá đậm (#008000), xanh lá rực mới là "lime"; "violet" là tím hồng nhạt.
- Trong CSS, "cyan" và "aqua" cùng là #00FFFF, "magenta" và "fuchsia" cùng là #FF00FF.
Muốn hiểu 6 ký tự của mã hex và cách đổi sang RGB, xem bài mã màu hex là gì.
Tổng quan các loại màu cơ bản trong thiết kế
#1: Màu đỏ - Đại diện cho đam mê, năng lượng và nhiệt huyết
Logo của một số thương hiệu có sử dụng màu đỏ (Nguồn: Brands Vietnam)
- Ngành phổ biến: ẩm thực, ô tô, công nghệ, nông nghiệp
- Ngành không phổ biến: tài chính, hàng không, quần áo
Lưu ý: Tránh lạm dụng vì có thể gây cảm giác quá kích thích cho người xem.
#2: Màu xanh lam - Truyền tải sự tin cậy, an toàn và chuyên nghiệp
Logo của một số thương hiệu có sử dụng màu xanh lam (Nguồn: Cánh Cam)
- Ngành phổ biến: năng lượng, hàng không, tài chính, công nghệ, chăm sóc sức khỏe, nông nghiệp.
- Không phổ biến: ẩm thực
Lưu ý: Tránh dùng màu xanh lam nhạt quá mức vì có thể làm thiết kế thiếu điểm nhấn.
#3: Màu vàng - Tạo cảm giác vui vẻ, hạnh phúc và tích cực.
Logo của một số thương hiệu có sử dụng màu vàng (Nguồn: Cánh Cam)
- Ngành phổ biến: năng lượng, ẩm thực, dụng cụ gia đình
- Không phổ biến: tài chính, quần áo, ô tô, công nghệ
Lưu ý: Cân nhắc độ tương phản khi phối với nền trắng hoặc màu sáng.
Các hệ màu quan trọng bắt nguồn từ màu cơ bản
#1: Màu thứ cấp (Secondary Colors)
Màu thứ cấp được tạo ra bằng cách pha trộn giữa hai màu cơ bản. Cụ thể:
- Đỏ + Vàng = Cam
-Vàng + Xanh = Lục
- Đỏ + Xanh = Tím
Những màu này giúp người thiết kế có thể mở rộng bảng màu song vẫn giữ được tính thống nhất khi thiết kế.
#2: Màu tam cấp (Tertiary Colors)
Khi pha giữa màu cơ bản và màu thứ cấp liền kề, ta được màu tam cấp. Ví dụ: đỏ cam, vàng lục, xanh tím...
Đây là những gam màu giúp bạn tạo chiều sâu và sự sinh động cho thiết kế của mình.
Ghi chú của ColorME (10/2026): Ghép 3 màu cơ bản, 3 màu thứ cấp và 6 màu tam cấp, bạn có đủ 12 màu của vòng tròn màu; cách đọc vòng màu có trong bài vòng tròn màu sắc Color Wheel. Tỉ lệ pha cụ thể cho màu nước, acrylic nằm trong bài bảng pha màu. Muốn thử trước khi pha thật, bạn có thể dùng Bảng pha màu online của ColorME; trang công cụ ghi "Công cụ miễn phí, không cần đăng nhập" và lưu ý: "Mô phỏng trên màn hình: màu thật còn tuỳ hãng sơn, độ đặc, giấy và màn hình. Pha thử một ít trước."

3 màu cơ bản, 3 màu thứ cấp và 6 màu tam cấp cho đủ 12 màu của vòng tròn màu. Màu tam cấp vẽ bằng ô chia đôi vì bài không ghi mã của chúng. Hình do ColorME tự dựng.
Các nguyên tắc phối màu trong thiết kế từ màu cơ bản
#1: Phối màu đơn sắc (Monochromatic)
Phối màu đơn sắc theo bánh xe màu sắc (Nguồn: YBOX)
Phối màu đơn sắc là sử dụng một màu chủ đạo với nhiều sắc độ sáng tối khác nhau. Ví dụ: Khi sử dụng màu vàng để làm thiết kế chính, ta sẽ sử dụng thêm các màu vàng khác nhưng nhạt hơn để dùng cho các chi tiết phụ. Đây là phương pháp phối màu an toàn nhưng vẫn hiệu quả.
Ứng dụng: Thiết kế tối giản, poster, banner sản phẩm.
#2: Phối màu bổ sung (Complementary)
Phối màu bổ túc theo bánh xe màu sắc (Nguồn: YBOX)
Với phương pháp phối màu này, ta sẽ dùng hai màu đối diện nhau trên bánh xe màu giúp tạo sự tương phản mạnh mẽ.
- Ứng dụng: Thiết kế sản phẩm nổi bật, quảng cáo.
Lưu ý: Nên điều chỉnh độ bão hòa để tránh quá chói.
#3: Phối màu tương đồng (Analogous)
Phối màu tương đồng theo bánh xe màu sắc (Nguồn: YBOX)
Phối màu tương đồng là chọn ba màu nằm liền kề nhau trên bánh xe màu. Cách này giúp tạo cảm giác hài hòa, dễ chịu.
- Ứng dụng: Thiết kế thương hiệu nhẹ nhàng, website.
#4: Phối màu bộ ba (Triadic)
Phối màu bộ ba theo bánh xe màu sắc (Nguồn: YBOX)
Chọn ba màu cách đều nhau trên bánh xe màu (ví dụ: đỏ - vàng - xanh lam) để sử dụng trong thiết kế. Đây là cách phối giúp ấn phẩm của mình có sự cân bằng và sinh động.
Ghi chú của ColorME (10/2026): Ngoài 4 cách trên còn có phối màu tách đôi bổ sung (split complementary) và bộ bốn (tetradic). Cả 6 kiểu, kèm bảng mã HEX dựng từ một màu gốc, được trình bày trong bài vòng tròn màu sắc.
Gợi ý cách chọn bảng phối màu trong thiết kế hiệu quả
- Dựa vào cảm xúc thương hiệu: Màu sắc cần phản ánh tính cách của thương hiệu.
- Ưu tiên sự tương phản: Đảm bảo người xem dễ đọc, dễ nhìn.
- Hạn chế dùng quá nhiều màu: 2-4 màu là hợp lý trong một thiết kế.
- Sử dụng công cụ hỗ trợ: Chúng ta có thể dùng Adobe Color, Coolors hoặc Canva để tạo bảng màu từ màu cơ bản.
Màu cơ bản và bản sắc thương hiệu - Mối liên hệ không thể tách rời
Một trong những ứng dụng quan trọng nhất của màu cơ bản chính là xây dựng và duy trì bản sắc thương hiệu. Mỗi thương hiệu lớn trên thế giới đều gắn liền với một màu sắc đặc trưng. Từ xanh dương của Facebook, đỏ của Coca-Cola, hay tím của Milka. Những màu sắc này không chỉ là yếu tố thẩm mỹ mà còn mang tính biểu tượng, truyền tải cá tính và giá trị cốt lõi của thương hiệu đó.
Các thương hiệu thường sử dụng từ 1 đến 3 màu cơ bản hoặc các biến thể của chúng để xây dựng hệ thống phối màu trong thiết kế đồng bộ trên mọi nền tảng truyền thông. Điều này tạo nên sự nhận diện dễ nhớ, nhất quán và tăng độ tin cậy trong mắt người dùng.
Ví dụ ứng dụng thực tế:
1. Coca-Cola: Sử dụng màu đỏ như một màu cơ bản đại diện cho sự năng động, tươi mới và sự trẻ trung. Màu đỏ giúp các thiết kế quảng cáo của hãng luôn nổi bật, kể cả khi đứng cạnh nhiều thương hiệu khác.
Nguồn: Coca-Cola
IKEA: Kết hợp giữa vàng và xanh lam - cả hai đều là màu cơ bản - giúp tạo cảm giác thân thiện, dễ tiếp cận và đáng tin cậy.
Nguồn: IKEA
Google: Logo Google sử dụng đến 4 màu (xanh dương, đỏ, vàng và xanh lá). Tuy nhiên, 3 trong số đó là màu cơ bản. Việc này giúp thương hiệu vừa dễ nhận diện, vừa tạo cảm giác vui nhộn, thân thiện.
Nguồn: Google
Những sai lầm phổ biến khi sử dụng màu cơ bản trong thiết kế
Việc sử dụng màu cơ bản không đúng cách có thể khiến thiết kế trở nên rối mắt, thiếu tính chuyên nghiệp hoặc khiến người đọc hiểu nhầm về thông điệp. Dưới đây là một số sai lầm mà colorME khuyên bạn cần tránh:
Dùng màu quá bão hòa (saturation cao): Khi sử dụng màu đỏ, xanh hoặc vàng nguyên bản ở cường độ cao sẽ thiết kế có thể trở nên chói mắt, gây khó chịu.
Phối màu không có sự tương phản hợp lý: Ví dụ, dùng chữ màu vàng trên nền trắng hoặc xanh lam đậm trên nền đen sẽ khiến nội dung khó đọc.
Thiếu đồng nhất trong hệ thống màu: Nếu bạn sử dụng màu cơ bản cho logo nhưng lại không áp dụng logo đó cho website, bao bì,... Sẽ tạo sự thiếu nhất quán và khiến thương hiệu trở nên thiếu chuyên nghiệp.
Ghi chú của ColorME (10/2026): Có thể đo độ tương phản bằng con số. Tiêu chuẩn WCAG 2.2 của W3C yêu cầu chữ thường có tỉ lệ tương phản ít nhất 4.5:1 so với nền, chữ cỡ lớn ít nhất 3:1. ColorME tính theo công thức của WCAG cho các cặp màu trong ví dụ trên: chữ vàng #FFFF00 trên nền trắng chỉ đạt 1.07:1, chữ xanh navy #000080 trên nền đen đạt 1.31:1, đều quá thấp. Đổi lại, navy trên nền trắng đạt 16.01:1 và vàng trên nền đen đạt 19.56:1. Màu đỏ thuần #FF0000 trên nền trắng đạt 4.0:1: đủ cho tiêu đề cỡ lớn, chưa đủ cho chữ thường.

Cùng một màu chữ, đổi nền là đổi độ tương phản. Tỉ lệ do ColorME tính theo công thức của WCAG 2.2. Hình do ColorME tự dựng.
Mẹo nhỏ để ứng dụng màu cơ bản linh hoạt và sáng tạo
Để sử dụng màu cơ bản một cách hiệu quả và sáng tạo trong quá trình phối màu trong thiết kế, colorME mách bạn một số mẹo sau:
Tạo tone-on-tone bằng cách pha trắng hoặc đen: Thay vì dùng màu đỏ nguyên bản, hãy thử các biến thể như đỏ rượu, hồng nhạt, đỏ đất. Điều này giúp thiết kế của bạn trở nên tinh tế và dễ chịu hơn.
Kết hợp với màu trung tính: Màu trắng, đen, xám hoặc be là những màu trung tính sẽ làm nền cho các màu cơ bản được nổi bật hơn.
Tận dụng tỷ lệ phối màu: Một nguyên tắc vàng là 60-30-10. Trong đó, 60% là màu nền chính, 30% là màu phụ và 10% là điểm nhấn - thường là một màu cơ bản.
Ghi chú của ColorME (10/2026): Pha trắng vào màu gọi là tint, pha đen gọi là shade, pha xám gọi là tone. Ý nghĩa từng thuật ngữ và độ bão hoà (saturation) có trong bài các thuật ngữ về màu sắc. Màu pha nhiều trắng chính là màu pastel; 40 mã HEX pastel chia theo họ màu có trong bài bảng màu pastel.
Ứng dụng thực tế của màu cơ bản trong các lĩnh vực thiết kế
#1: Thiết kế logo
Khi thiết kế logo, ta thường sử dụng tối đa 3 màu, trong đó có ít nhất một màu thường là màu cơ bản. Điều này giúp logo đơn giản, dễ nhận diện và người xem dễ ghi nhớ logo đó.
#2: Thiết kế giao diện web
Trong UI/UX, màu cơ bản giúp tạo hệ thống phân cấp thông tin và phân cấp thị giác rõ ràng. Đặc biệt, màu của button và tiêu đề thường sử dụng màu cơ bản để tăng tính tương tác.
#3: Thiết kế ấn phẩm quảng cáo
Poster, brochure, banner... đều cần kỹ năng phối màu chuẩn để thu hút sự chú ý của khách hàng và truyền tải thông điệp nhanh chóng.
Câu hỏi thường gặp về màu cơ bản
3 màu cơ bản là màu gì?
Vẽ tranh, pha sơn: đỏ, vàng, xanh lam. Màn hình: đỏ, xanh lục, xanh lam. In ấn: xanh lơ, hồng sen, vàng.
4 màu cơ bản là gì?
Thường là 4 màu mực in CMYK: xanh lơ, hồng sen, vàng và đen. Adobe gọi cách in phối 4 mực này là four-color process printing, tức in 4 màu.
5 màu cơ bản và 6 màu cơ bản là những màu nào?
Không có bộ 5 màu chuẩn. Thường gặp là 3 màu cơ bản thêm trắng và đen, đủ để làm sáng, làm tối màu khi vẽ. "6 màu cơ bản" thường là 3 màu cơ bản cộng 3 màu thứ cấp: đỏ, cam, vàng, xanh lục, xanh lam, tím.
8 màu cơ bản là gì?
Là 8 màu bạn có khi mỗi kênh đỏ, lục, lam chỉ bật tắt hết mức (0 hoặc 255): đen, trắng, đỏ, xanh lục, xanh lam, xanh lơ, hồng sen, vàng. Đây cũng là 3 màu cơ bản của RGB, 3 màu cơ bản của CMY, cùng trắng và đen.
Kết luận: Làm chủ màu cơ bản để phối màu trong thiết kế hiệu quả
Dù bạn là người mới học thiết kế hay đã có kinh nghiệm, việc hiểu và ứng dụng tốt màu cơ bản là chìa khóa để phối màu trong thiết kế hiệu quả và chuyên nghiệp. Chỉ khi nắm vững các nguyên lý phối màu từ ba màu gốc này, bạn mới có thể tạo ra những sản phẩm thiết kế hài hòa, nổi bật và ghi dấu ấn thị giác mạnh mẽ.
Nếu bạn quan đến kiến thức phối màu cơ bản nói riêng, cũng như kiến thức chuyên sâu khác về thiết kế đồ hoạ nói chung thì hãy tham khảo khoá Thiết Kế Chuyên Sâu của colorME nhé!
Tác giảQuỳnh Ngân














