Tạo một sơ đồ màu Web

01 trên 10

Hiểu sơ đồ màu và màu web

Màu cơ bản - màu vàng mù tạt. Hình ảnh của J Kyrnin

Có bốn lược đồ màu cơ bản mà bạn có thể sử dụng cho một trang Web. Mỗi trang của bài viết này cho thấy một hình ảnh của bảng phối màu và cách bạn có thể tạo ra một sơ đồ tương tự trong Photoshop.

Tất cả các lược đồ màu sẽ sử dụng màu vàng này làm màu cơ sở.

02 trên 10

Sơ đồ màu Web đơn sắc

Monochromatic Web Color Scheme. Hình ảnh của J Kyrnin

Lược đồ màu này sử dụng màu vàng mù tạt của màu cơ bản của tôi và thêm một số màu trắng và đen để tô màu và tô bóng lược đồ cho phù hợp.

Các sơ đồ màu đơn sắc thường dễ dàng nhất trên mắt của tất cả các lược đồ màu. Những thay đổi nhẹ nhàng trong sắc thái và bóng râm làm cho màu sắc chảy vào nhau tốt hơn. Sử dụng bảng màu này để làm cho trang web của bạn xuất hiện nhiều chất lỏng hơn và được thu thập.

03 trên 10

Thêm sơ đồ màu Web đơn sắc

Monochromatic Web Color Scheme. Hình ảnh của J Kyrnin

Đã thêm một hình vuông có màu đen 20% để có nhiều màu hơn trong lược đồ. Việc thêm màu đen hoặc trắng vào các màu của bạn có thể tạo ra một màu mới cho bảng màu của bạn mà không làm xáo trộn tông màu của trang.

04 trên 10

Lược đồ màu Web tương tự

Sơ đồ màu web tương tự. Hình ảnh của J Kyrnin

Lược đồ màu này có màu cơ bản màu vàng và cộng thêm 30 độ màu trong bảng màu của Photoshop.

Các màu tương tự có thể hoạt động rất tốt với nhau, nhưng đôi khi chúng có thể bị xung đột. Hãy chắc chắn để kiểm tra các chương trình này với nhiều người hơn bản thân, gia đình và bạn bè của bạn. Khi họ làm việc, họ tạo ra một trang web nhiều màu sắc hơn so với chương trình đơn sắc, nhưng gần như là chất lỏng.

05 trên 10

Lược đồ màu tương tự hơn

Sơ đồ màu web tương tự. Hình ảnh của J Kyrnin

Đã thêm một hình vuông có màu đen 20% để có nhiều màu hơn trong lược đồ.

06 trên 10

Lược đồ màu Web bổ sung

Sơ đồ màu Web bổ sung. Hình ảnh của J Kyrnin

Các lược đồ màu bổ sung, không giống như các sơ đồ màu khác thường chỉ có hai màu. Màu cơ bản và ngược lại trên bánh xe màu. Photoshop giúp bạn dễ dàng nhận được màu bổ sung - chỉ cần chọn vùng màu mà bạn muốn bổ sung và nhấn Ctrl-I. Photoshop sẽ đảo ngược nó cho bạn. Hãy chắc chắn để làm điều này trên một lớp trùng lặp, vì vậy bạn không mất màu cơ bản của bạn.

Các phối màu bổ sung thường nổi bật hơn nhiều so với các phối màu khác, vì vậy hãy sử dụng chúng cẩn thận. Chúng thường được sử dụng trên các phần cần phải nổi bật.

07 trên 10

Thêm lược đồ màu bổ sung

Sơ đồ màu Web bổ sung. Hình ảnh của J Kyrnin

Để có được phiên bản này, tôi đã thêm 50% màu trắng vào nửa dưới của màu sắc và 30% màu đen đến hình vuông trung tâm. Như bạn có thể thấy, nó cung cấp cho bạn một vài tùy chọn khác nhưng nó vẫn là một bảng phối màu bổ sung.

08 trên 10

Triadic Web Color Scheme

Triadic Web Color Scheme. Hình ảnh của J Kyrnin

Các phối màu ba màu được tạo thành từ 3 màu nhiều hơn hoặc ít hơn khoảng cách đều nhau xung quanh bánh xe màu. Bởi vì một bánh xe màu là 360 độ, tôi lại sử dụng hộp màu trong bộ chọn màu để cộng và trừ 120 độ so với màu cơ bản.

Các phối màu ba màu thường tạo ra các trang web rất sôi động. Nhưng giống như các phối màu bổ sung, chúng có thể ảnh hưởng đến mọi người một cách khác nhau. Hãy chắc chắn để kiểm tra.

Bạn cũng có thể tạo các bảng màu tetradic hoặc 4 màu, trong đó các màu có khoảng cách đều nhau xung quanh bánh xe màu.

09 trên 10

Lược đồ màu Web Triadic khác

Triadic Web Color Scheme. Hình ảnh của J Kyrnin

Như với các ví dụ khác, tôi đã thêm một hình vuông màu đen 30% vào các màu để có được các sắc thái bổ sung.

10 trên 10

Lược đồ màu Web bất hòa

Lược đồ màu Web bất hòa. Hình ảnh của J Kyrnin

Vẻ đẹp là trong con mắt của khán giả, nhưng nó là một thực tế không may rằng không phải tất cả các màu sắc đi cùng nhau. Màu sắc bất đồng là các màu xa hơn khoảng 30 độ ngoài bánh xe màu và không bổ sung hoặc là một phần của bộ ba.

Các kế hoạch màu sắc bất hòa có thể rất gây sốc và chỉ được sử dụng để tạo sự chú ý. Hãy nhớ rằng bởi vì những màu sắc này thường xuyên sẽ xung đột, sự chú ý bạn nhận được có thể không chính xác những gì bạn đang tìm kiếm.