Cách kết hợp màu sắc cơ bản từ bánh xe màu

Đến hẹn lại lên, bài đầu tiên sẽ gửi tới các bạn kiến thức về màu sắc trong website. Bài viết này dành cho các bạn đang muốn tìm hiểu về đồ hoạ hay là người mới bắt đầu bước chân vào nghề, mình sẽ nói thẳng vào vấn đề chính, còn về nguyên lý màu sắc mình sẽ viết 1 bài riêng nói về nó cho các bạn.

Bánh xe màu sắc (vòng tròng màu sắc) là nền tảng cơ bản trong thiết kế nói chung và thiết kế web nói riêng. Nếu bỏ qua điều này thì nó giống như là việc làm nhà mà bỏ qua phần nền móng vậy. Một bánh xe màu cơ bản có 12 màu tiêu chuẩn được sử dụng để tạo ra các phối màu khác nhau. Tại nội dung bên dưới, tôi sẽ đưa ra một số kiểu sử dụng màu sắc từ bánh xe màu, và bạn có thể áp dụng trong việc chọn màu cho thiết kế của bạn.

 

mau-sac-32.png

Có 4 kiểu sử dụng bánh xe màu, và bạn có thể áp dụng trong việc chọn màu cho thiết kế của bạn:

A. Cách kết hợp màu đơn sắc

Là cách phối màu đơn giản nhất nhưng lại vô cùng hiệu quả. Khi sử dụng phối màu đơn sắc, thường chỉ sử dụng một màu duy nhất hoặc đôi khi cũng có thể sử dụng nhiều sắc độ khác nhau của cùng một màu để chúng cộng hưởng với nhau.

mau-sac-33.png

Vẫn là tông màu tím nhưng mình có thể dung độ đậm nhạt khác nhau để thể hiện cho màu.

B. Cách kết hợp màu bổ túc trực tiếp

Dựa trên hai màu sắc từ phía đối diện của bánh xe màu. Bởi vì hai màu sắc sẽ khác biệt rất nhiều, các thiết kế sử dụng như vậy có thể rất hiệu quả và đáng chú ý.

mau-sac-34.png

C. Cách kết hợp màu tương đồng (Tương tự)

Phối màu bổ túc trực tiếp sử dụng những cặp màu đối xứng nhau trên vòng tròn màu sắc, các thiết kế sử dụng như vậy có thể rất hiệu quả và nổi bật. Cũng chính vì sự đối lập giữa các màu như vậy, phối màu bổ túc trực tiếp này hoàn toàn không phù hợp nếu website của bạn mang phong cách của sự thư giãn và nhẹ nhàng.

mau-sac-35.png

D. Cách kết hợp màu bổ túc bộ ba

Để tạo một sơ đồ màu bổ túc bộ ba, bạn hãy vẽ một tam giác đều trên bánh xe màu, và chọn ba màu tại 3 góc của tam giác.

mau-sac-36.png

 

E. Cách kết hợp màu bổ túc xen kẽ

Phối màu bổ túc xen kẽ này sẽ là sự lựa chọn hoàn hảo cho các nhà thiết kế. Phối màu này được tạo bởi ba màu nằm ở ba góc trên vòng tròn màu và tạo nên một “hình tam giác cân”. Đôi khi, ta có thể sử dụng thêm màu thứ tư, thứ năm, và màu này phải đối xứng với một trong hai màu tạo nên đáy của hình tam giác cân đó.

Chính vì sự linh hoạt trong việc chọn màu mà cách phối màu sắc này thường mở ra cho các nhà thiết kế rất nhiều cơ hội khám phá và tìm được các cặp màu lạ và độc đáo cho website của mình.

 

Ngày này, có rất nhiều website chuộng phối màu này. Chủ yếu họ sử dụng màu đen và trắng làm những màu chủ đạo, song song với việc tô điểm bằng các màu thứ 3 bắt mắt như đỏ và xanh với các chi tiết phụ. Phối màu này đơn giản và an toàn nhưng vô cùng hiệu quả. Tuy nhiên, để thử thách bản thân cũng như muốn website của mình trở nên cầu kì hơn, bạn có thể sử dụng những màu bậc nhất (vàng, đỏ, lam) xem thế nào nhé.

F. Cách kết hợp màu bổ túc bộ bốn

Phối màu này được hình thành bởi bón màu sắc bao gồm 2 cặp màu bổ túc trực tiếp. Để có hiệu quả nhất, tốt nhất nên để một trong bốn màu làm màu chủ đạo. Những sự đối nghịch cũng như bổ sung giữa hai cặp màu này chính là sự khác biệt đặc trưng của phối màu này. Các cặp màu trong phối màu này thoạt nhìn thì rất khó để có thể phối hợp và sử dụng chúng đúng cách, vì thế bạn sẽ mất khá nhiều thời gian cho khâu chọn lọc và lên màu cho website của mình.

Untitled-3.jpg

 

3. Tham khảo màu sắc, và lấy cảm hứng bảng màu từ những trang sau:

Bạn có thể tham khảo cách phối màu của những trang web bên dưới.

http://www.colourlovers.com/

Home Page


https://www.awwwards.com/
https://dribbble.com/webflow

Kết luận

Chọn màu gì? Phối màu ra sao? Đó là những câu hỏi mà bạn phải tự trả lời cho mình trước khi bắt tay vào một bản thiết kế. Các cách phối màu cơ bản trên tuy là dành cho thiết kế website nhưng bạn có thẻ áp dụng chúng cho bất cứ thiết kế nào bạn muốn. Khi bạn muốn phối màu cho thiết kế đơn giản như thiết kế phẳng, hãy lưu ý đến những phối màu đơn sắc, tương đồng hay bổ túc trực tiếp.

Chúc thành công !


Bài viết liên quan