Home 線上工具Chrome 外掛 Brandfetch 查詢網頁顏色色碼、字型、Logo圖案、16進制色碼(Chrome 擴充外掛)

Brandfetch 查詢網頁顏色色碼、字型、Logo圖案、16進制色碼(Chrome 擴充外掛)

by techrabbit

Brandfetch 查詢網頁顏色色碼、字型、Logo圖案

Brandfetch 是一個可以讓你快速抓取網頁顏色色碼的網站,一般網頁設計時,你可能會想知道別的網站都使用什麼樣的色碼,工程師可能需要花點時間查詢,但使用Brandfetch可以讓你一鍵查詢任何網站的網頁所使用的色碼,相當方便。

下面教學怎麼使用Brandfetch 抓取網頁顏色色碼。

Brandfetch 抓取網頁顏色色碼教學

▼首先,點選上方網址,前往這個「 Brandfetch」Chrome外掛插件,進到官方下載頁面,點選安裝即可。安裝完之後,瀏覽器的右上角會出現Brandfetch的小圖示。

Brandfetch 查詢網頁顏色色碼、字型、Logo

▼安裝好這個外掛之後,Chrome瀏覽器右上角會出現該外掛名稱「Brandfetch 」,點擊它執行。

Brandfetch 查詢網頁顏色色碼、字型、Logo

▼之後「Brandfetch 」這個外掛會要求你輸入Token,而要獲取Token需要先註冊,所以點擊「Your account」就可以前往註冊這個外掛。

Brandfetch 查詢網頁顏色色碼、字型、Logo

▼註冊好帳號之後,你會收到信箱認證信,到信箱收取認證信,你會跟著收到「Access token」,並且Brandfetch 會告訴你,這個外掛只允許你每個月查詢三百次網頁顏色代碼、Logo、字型的資訊。只要三百次,但應該很夠用了。

Brandfetch 查詢網頁顏色色碼、字型、Logo

▼接下來回到Chrome瀏覽器,點選Brandfetch 這個外掛,輸入該Access token,你就可以開始使用啦!點選任何網站,再點選瀏覽器右上角Brandfetch 小圖示,你就會看到這個網站使用的顏色代碼、Logo、字型…等資訊,相當方便。Brandfetch 會列出這個網站所主要使用的顏色,點擊顏色色塊,你就會直接複製顏色代碼了。

Brandfetch 查詢網頁顏色色碼、字型、Logo

▼任何網站都可以查詢,例如經理人網站的顏色代碼就是朱紅色的,想要知道這個網站使用的十六進制顏色代碼,只需要點選一下顏色色塊,就會直接複製了,相當方便。

Brandfetch 查詢網頁顏色色碼、字型、Logo

上面就是使用Brandfetch 查詢任何網站顏色代碼、字體、Logo的教學啦!

其他人也在看