如果想知道某個(gè)網(wǎng)站配色方式,除了打開開發(fā)人員工具或是檢視源碼,也有第三方服務(wù)可以使用,即使無法完整復(fù)制別人的配色,也能快速得知網(wǎng)站使用的顏色代碼或配色模式,取得顏色的色碼或色彩名稱。有沒有任何更直覺、簡(jiǎn)單的方式來完成這些工作呢?若你有類似的需求,接下來要介紹的服務(wù)或許可以滿足,這項(xiàng)服務(wù)會(huì)提取特定網(wǎng)頁(yè)使用的顏色,讓顏色相關(guān)信息更一目了然。
本文要介紹的「Alwane」是一個(gè)網(wǎng)頁(yè)色彩提取工具,可以在使用者輸入特定的網(wǎng)址后取得該網(wǎng)站使用的顏色代碼或描述,產(chǎn)生為調(diào)色盤鏈接,重新分類、編排各種顏色,最簡(jiǎn)單的使用方式是輸入網(wǎng)站網(wǎng)址就能提取,也能顯示其他相關(guān)色彩,如果想分析、保存某個(gè)網(wǎng)站或品牌使用的顏色,Alwane 是個(gè)非常方便而且好用的工具。
除了將提取的顏色代碼以可視化方式呈現(xiàn),還能夠以調(diào)色盤或是程序代碼方式呈現(xiàn),包括 CSS 和 SASS 兩種顯示程序代碼,對(duì)于要取得特定的網(wǎng)站顏色來說很有用,若有類似需求的話不妨打開 Alwane 網(wǎng)站試試看。
Alwane
網(wǎng)站鏈接:https://alwane.io/
使用教學(xué)
開啟 Alwane 網(wǎng)站后直接在左上角「Extract CSS Colors」輸入要提取顏色的網(wǎng)址,預(yù)設(shè)情況下會(huì)從 HTML 和 CSS 樣式表單取得顏色,如果某些情境下需要從 JavaScript 獲取顏色可在「Advanced」設(shè)定選項(xiàng)找到。
從提取后的色彩結(jié)果可以看到各種顏色分布,包括顏色的預(yù)覽、變量名稱和色碼(hex code),從左側(cè)可選擇為顏色重新分組、排序或是切換 CSS、SASS 色碼。
從上方選項(xiàng)切換調(diào)色盤或程序代碼模式,也能快速將所有 CSS 代碼復(fù)制到剪貼簿。
如果想要保存或分享網(wǎng)站的配色、調(diào)色盤、CSS 等信息,點(diǎn)選右上角「Generate」就能產(chǎn)生鏈接咯!
值得一試的三個(gè)理由:
- Alwane 網(wǎng)頁(yè)色彩分析工具,輸入網(wǎng)址就能提取網(wǎng)頁(yè)出現(xiàn)的顏色
- 從 HTML、CSS 和 JavaScript 獲取色彩信息
- 查詢結(jié)果會(huì)有顏色預(yù)覽、變量名稱和色碼,也能切換為程序代碼模式
復(fù)制本文鏈接 文章為作者獨(dú)立觀點(diǎn)不代表優(yōu)設(shè)網(wǎng)立場(chǎng),未經(jīng)允許不得轉(zhuǎn)載。
發(fā)評(píng)論!每天贏獎(jiǎng)品
點(diǎn)擊 登錄 后,在評(píng)論區(qū)留言,系統(tǒng)會(huì)隨機(jī)派送獎(jiǎng)品
2012年成立至今,是國(guó)內(nèi)備受歡迎的設(shè)計(jì)師平臺(tái),提供獎(jiǎng)品贊助 聯(lián)系我們
品牌形象設(shè)計(jì)標(biāo)準(zhǔn)教程
已累計(jì)誕生 726 位幸運(yùn)星
發(fā)表評(píng)論 為下方 3 條評(píng)論點(diǎn)贊,解鎖好運(yùn)彩蛋
↓ 下方為您推薦了一些精彩有趣的文章熱評(píng) ↓