黑白灰低調(diào)大氣范的網(wǎng)頁設(shè)計(jì)欣賞
我要評(píng)論在經(jīng)典配色中，可能每個(gè)人都不會(huì)否認(rèn)黑白灰的永恒魅力。雖然人們總是想“outstanding”,眼球搶奪，注意吸引……但想要把用戶永遠(yuǎn)留住，除了第一印象，更多需要日后方方面面的細(xì)節(jié)。況且在我們的身邊已經(jīng)太多色彩大爆炸了，我們顏色識(shí)別系統(tǒng)也許到了某一峰值，總也想要有停下運(yùn)轉(zhuǎn)的時(shí)刻。這時(shí)，黑白灰的配色就從一大堆顏色中尤為突出，甚至能讓人心恢復(fù)平靜，這也是這兩年開始盛行極簡(jiǎn)風(fēng)格的原因。
下面是小編篩選的13個(gè)黑白灰配色網(wǎng)站，大家也許可以作為網(wǎng)頁設(shè)計(jì)時(shí)色系風(fēng)格的參考。
1、Aristo
裝潢建筑設(shè)計(jì)機(jī)構(gòu)以黑、白以及金色作為其主色調(diào)搭配，與其本身所傳達(dá)的設(shè)計(jì)哲學(xué)不無深沉的關(guān)系。頁面結(jié)構(gòu)簡(jiǎn)單、干凈、簡(jiǎn)約。主頁圖片都被抽去了色彩，只保留低調(diào)的灰色階，而輔助的其他顏色也依然保持低調(diào)、內(nèi)斂，突顯出另一種奢華。
2、Basic
以黑白灰配色，同時(shí)非常少量地運(yùn)用其他鮮明的色調(diào)，幾乎是黑白灰配色的秘籍之一，然而在整個(gè)構(gòu)圖上，還需要更多空間，才能表達(dá)出平靜、冷酷中的躍動(dòng)感。這個(gè)網(wǎng)站的設(shè)計(jì)遵守了這一秘籍，但又增加了其他的圖片色，讓畫面略顯復(fù)雜。
3、Callens
以兩張隨意疊放式樣的圖片居于正中，足夠的留白給人以想象的空間，用色謹(jǐn)慎，讓人感覺這確實(shí)是高端品牌的氛圍。
4、Driftwoodeditions
獨(dú)立的小型出版社，成品選用黑白，整個(gè)網(wǎng)站也使用黑白，氛圍過于嚴(yán)肅。但卻能體現(xiàn)出出版行業(yè)的類似黑白影印的質(zhì)感。
5、Designembraced
以大圖全屏展示作品細(xì)節(jié)的網(wǎng)站來說，黑白灰似乎是唯一的選擇，但同時(shí)，設(shè)計(jì)師也安排了紅色。在大圖展示的交互上非常巧妙。黑色傳遞出一種酷，深色氛圍，更加凸顯細(xì)節(jié)中的閃光點(diǎn)。
6、Echo
頁面采用黑白線條，顯得大氣，但容易給人眼花繚亂的效果。往下拉的介紹中，文字都采用黑白，而在指向時(shí)又顯示為一種彩色。偏愛的豎線，在人物形象處用上給人以現(xiàn)代和時(shí)尚感。
7、Fixate
整個(gè)首頁采用黑色線條矢量圖組成一個(gè)密集式的豐富多彩的圖片，突出設(shè)計(jì)原創(chuàng)性。而字體也與此相稱，整個(gè)網(wǎng)站設(shè)計(jì)感很強(qiáng)，還適當(dāng)裝飾了動(dòng)畫效果，不失為上乘之作。
8、Functionals
家居設(shè)計(jì)公司網(wǎng)站，主題依然讓渡給內(nèi)容，讓家居設(shè)計(jì)本身說話。在黑白配色基礎(chǔ)上，配以木質(zhì)的奶黃色，讓人聯(lián)想到木質(zhì)家居，營(yíng)造一種輕松明快的氛圍。
9、Huntly
室內(nèi)設(shè)計(jì)工作室以白色作為其主色，給人以空間感，首頁對(duì)自我形象的表達(dá)和包裝，顯得流暢、簡(jiǎn)潔。而在黑白的簡(jiǎn)單配色中隱含了明黃色，作為強(qiáng)調(diào)色，在此讓整個(gè)網(wǎng)站顯得更加活潑、鮮明。
10、Johnson, B. C
科學(xué)家Johnson, B. C的個(gè)人博客，背景使用他的科研領(lǐng)域的自然圖片，配色為深黑，突出嚴(yán)謹(jǐn)、神秘以及酷的印象。
11、readcereal
灰色調(diào)背景的網(wǎng)站，讓整個(gè)氛圍趨于平淡，而配合使用高品質(zhì)的同樣色系的圖片，感覺非常雅致。
12、Taostudio
以一種米色粉作為底色，和傳統(tǒng)的黑白灰網(wǎng)站不同，它傳達(dá)出一種溫馨感。而主頁對(duì)縮略圖的排列和設(shè)計(jì)極富新鮮感以及整體感。運(yùn)用簡(jiǎn)單的線條手繪圖搭配得恰到好處。
13、vincefrost
黑白的滿屏大圖，大型的文字，沉浸式的導(dǎo)航和內(nèi)容。在鼠標(biāo)經(jīng)過會(huì)有些許色差呈現(xiàn)。整個(gè)網(wǎng)站架構(gòu)清晰、操作流暢。
相關(guān)文章
15 個(gè)為編程初學(xué)者準(zhǔn)備的網(wǎng)站(都是國(guó)外的一些網(wǎng)站)
今天的文章，我們將分享15個(gè)可以學(xué)習(xí)編程的網(wǎng)站，這些網(wǎng)站上提供了很多編程教程，圖書以及編程練習(xí)，希望對(duì)你有用2024-11-02- 這篇文章主要介紹了web開發(fā)中的長(zhǎng)度單位主要包括px,pt，em等,需要的朋友可以參考下2023-08-06
網(wǎng)頁前端開發(fā)的一些尺寸單位(px,rem單位)
px單位是絕對(duì)單位，一般用于pc端網(wǎng)頁開發(fā),因?yàn)槭墙^對(duì)單位所以在移動(dòng)端上的使用體驗(yàn)并不是很好,rem它是描述相對(duì)于當(dāng)前根元素字體尺寸，是相對(duì)單位,它可以根據(jù)根元素的變換而2023-08-06WEB前端優(yōu)化必備js/css壓縮工具YUI-compressor詳解與集成用法
壓縮工具層次不窮，各有優(yōu)點(diǎn)，選擇適合的壓縮工具為將來做項(xiàng)目開發(fā)使用是一件很重要的事情！！在這介紹YUI-compressor,需要的朋友可以參考下2023-06-21- 瀏覽器是多進(jìn)程的，有瀏覽器主進(jìn)程，網(wǎng)絡(luò)進(jìn)程，渲染進(jìn)程，插件進(jìn)程等，在將html，css，javascript解析成一個(gè)頁面的時(shí)候，就需要多個(gè)進(jìn)程的分工合作2023-05-01
- 本文為大家整理了常用的文件對(duì)應(yīng)的MIME類型，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-04-25
postman中form-data、x-www-form-urlencoded、raw、binary的區(qū)別介紹
這篇文章介紹了postman中form-data、x-www-form-urlencoded、raw、binary的區(qū)別，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-12-28網(wǎng)頁中使用Unicode字符的介紹(&#,\u等)
國(guó)際組織制定了可以容納世界上所有文字和符號(hào)的字符編碼方案，稱為Unicode，是通用字符集Universal Character Set的縮寫，用以滿足跨語言、跨平臺(tái)進(jìn)行文本轉(zhuǎn)換、處理的要求2021-11-27前端實(shí)現(xiàn)字符串GBK與GB2312的編解碼(小結(jié))
這篇文章主要介紹了前端實(shí)現(xiàn)字符串GBK與GB2312的編解碼(小結(jié))，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2020-12-02
告別硬編碼讓你的前端表格自動(dòng)計(jì)算的實(shí)例代碼
這篇文章主要介紹了告別硬編碼讓你的前端表格自動(dòng)計(jì)算,本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-09-27
