WhatFont Tool － 快速顯示網頁使用的字型、大小與行高

常常在瀏覽網頁時發現很漂亮的字體，想運用到自己的網站或部落格裡，比較有經驗的使用者會去找找網頁原始碼，或是從 CSS 檔裡挖掘出該網站使用的是哪一種字型。而不同的字型組合、樣式、行高與文字大小都會影響到整體的感覺，有沒有辦法可以快速獲取某一段文字的詳細資訊呢？WhatFont Tool 就是一款能快速查詢網頁字型的工具，只要拖曳至瀏覽器書籤，需要時點擊它就能使用。

網站資訊

• 網站名稱：WhatFont Tool
• 網站鏈結：https://chengyinliu.com/whatfont.html

進入 WhatFont Tool 後，將網頁拉到 How to Use It? ，會看到書籤列（Bookmarklet）及 Chrome 擴充元件（Extension）兩種使用工具，如果不想額外安裝擴充元件的話，使用書籤列就可以了，直接將 WhatFont 的按鈕拖曳到書籤列即可。

在網頁裡點擊「WhatFont」位於書籤列的按鈕，將滑鼠移到文字上方，就會立即顯示出該段文字的字型（Font-family）；在點擊一下滑鼠左鍵，會出現很詳細的資料，包括字型名稱（Font-family）、樣式（Style）、厚度（Weight）、大小（Font-Size）與行高（Line-height）五種資訊，很方便吧？

如果要離開 WhatFont 查詢模式，只要點擊畫面右上角的「Exit WhatFont」或是按下 ESC 鍵就能切回一般模式。