20 website minh chứng cho sức hút của gradients tới người xem (P.1)

Thứ hai - 13/08/2018 22:15

Chúng tôi chọn ra 20 thiết kế website mới có sử dụng gradient như một thành tố chính làm nên thành công của toàn bộ thiết kế.

20 website minh chứng cho sức hút của gradients tới người xem (P.1)

Dường như xu hướng thiết kế website phẳng đang chậm lại và tan rã dần. Bằng chứng cho điều này có lẽ là sự xuất hiện của xu hướng mới đang lên: gradients. Nó đã có sự biến đổi tinh tế hơn nhiều so với những cái mà chúng ta thấy ở web 2.0 và hoặc sau đó. Phải công nhận rằng gradients đã có sự trở lại. 

Chúng tôi chọn ra 20 thiết kế website mới có sử dụng gradient như một thành tố chính làm nên thành công của toàn bộ thiết kế. Đây sẽ là những ví dụ cho bạn hiểu được sự tinh tế và vẻ đẹp của gradients trong một thiết kế web hiện đại. 

VO2 Group

1 gradient trong thiet ke web chuyen nghiep

VO2 có website mới khá mạnh mẽ với những chi tiết được đè lên nhau. Một hình ảnh thú vị và khác biệt. Hình tam giác ở nền có một chút gradient, nó khiến cho hình khối tam giác trở nên hấp dẫn hơn về mặt hình ảnh. 

Melanie F – Look Book

2 gradient trong thiet ke web chuyen nghiep

đượcMelanie cđươclook book được bắt đầu với bố cục ngày càng phổ biến trong các trang web thời trang. Đó là nơi mà chữ không thẳng lề và đặt trên của hình ảnh. Trong trường hợp này, phần chữ được đặt phía trên lớp hình khối vuông và được dùng như header cua website. Hình khối chữ nhật là một gradient chuyển từ xanh lá đến tím và chắc chắn tạo sự thu hút. 

Adoratorio

3 gradient trong thiet ke web chuyen nghiep

Hãng thiết kế này sử dụng gradient theo cách khách bằng việc tô màu khu vực chữ với gradient. Đây là một cách làm rất độc đáo và cực kỳ thú vị. Một cách sáng tạo mới để định hình phong cách cho chữ và sử dụng nó. 

Qards

4 gradient trong thiet ke web chuyen nghiep

Qard có landing page sử dụng nhiều gradient. Hầu hết các khu vực trang khác nhau đều có gradients khác nhau làm nền. Phần website ở trên màn hình sử dụng màu cam, kết hợp với gradients xanh thẫm hoặc xanh lá cây. Phần nền của nó cũng như của toàn website trở nên rất thú vị. 

Symodd

5 gradient trong thiet ke web chuyen nghiep

Symodd có khu vực hero hoặc khu vực giới thiệu chứa gn khacgradient background với sắc thái từ cam chuyển sang hồng. Sự tinh tế ở chỗ hai tông màu này không khác nhau nhiều lắm, khiến cho sự chuyển tiếp trong mắt mọi người được nhẹ nhàng hơn. 

Inc

6 gradient trong thiet ke web chuyen nghiep

Inc sử dụng gradient ở khu vực hero của họ. Tuy nhiên họ có một chút khác biệt khi phủ lớp gradient xanh chuyển dần sang tím lên trên bức ảnh. Các kết hợp này xem ra khá phù hợp. 

Pho

7 gradient trong thiet ke web chuyen nghiep

Thêm một gradient xanh chuyển tím nữa. Cách chọn 2 màu rất ấn tượng, sự tương phản màu sắc tốt khiến nó vẫn còn thu hút được người xem.

Impossible Bureau

8 gradient trong thiet ke web chuyen nghiep

Impossible Bureau sử dụng gradient cực kỳ sinh động và tương phản tốt. Điều hay ở đây là khi một trang hoàn thành việc load các yếu tố của nó thì gradient sẽ hiện ra. 

Customeed

9 gradient trong thiet ke web chuyen nghiep

Customeed đã chuyển thành gradient màu xanh lá cây. Không có vấn đề gì với gradient xanh lá cây này. Diện mạo website nhìn chung khá ổn với nền gradient này. 

Webflow

10 gradient trong thiet ke web chuyen nghiep

Webflow không sử dụng nhiều gradient cho website của mình. Họ dùng những mảng màu gradient hồng nhỏ nhắn, chuyển dần sang tím rồi xanh với trang chủ của mình. Cách kết hợp những vệt màu gradient nhỏ nhắn này là biện pháp thông minh để tạo điểm nhấn. 

Tác giả bài viết: Phùng Thanh Hằng
Nguồn tin: www.youthedesigner.com