• 跳至主要導覽
  • Skip to main content
  • 跳至主要資訊欄

免費資源網路社群

免費資源指南,每日網路資訊與科技新知

  • 免費軟體
    • Mac
    • VPN
    • 瀏覽器外掛
      • Chrome
      • Firefox
      • Safari
    • 防毒軟體
    • 系統工具
    • 圖片處理
    • 文字編輯
  • APP
    • iOS
    • Android
  • 線上工具
    • 雲端掃毒
    • 線上翻譯
    • 線上轉檔
    • 縮網址
    • 產生器
    • Proxy
  • 免費空間
    • 網路硬碟
    • 圖片空間
    • 影片空間
    • 網站空間
  • 熱門主題
    • YouTube
    • Facebook
    • Dropbox
    • LINE
    • 字型下載
    • 免費圖庫
    • 限時免費
  • 網路科技
    • 個人服務
    • 實用教學
    • 免費桌布
    • 資料查詢
  • 架站資源
    • WordPress
    • DNS
    • 素材模版
    • 免費圖示
    • 搜尋引擎最佳化
    • 網站監測
  • 編輯精選
首頁 / 素材模版 / 免費圖示 / Line Awesome 超過 4000 個免費線稿圖示,修改自知名 Font Awesome

Line Awesome 超過 4000 個免費線稿圖示,修改自知名 Font Awesome

Line Awesome 超過 4000 個免費線稿圖示,修改自知名 Font Awesome

如果說到最知名的免費圖示字型(Icons Font),我想大家一定聽過 Font Awesome,這套圖示最初發佈於 2012 年,現今則由 1,544 個圖案組成,主要分為免費、開放原始碼和付費 Pro 圖示兩大類型,在使用 Font Scripts 網站中佔有 20% 市佔率,可以想見我們看到的很多圖案可能都是來自它。若要使用這套圖示,除了直接從官方網站或 GitHub 下載整套圖示集,亦可透過開放式內容傳遞網路提供的鏈結載入相關圖案。

接下來要介紹的「Line Awesome」來自 Icons8,也是相當著名的免費圖示提供商,之前曾介紹過免費音樂素材庫 Fugue、可自己製作圖庫的 Moose Photos 或自製創意插圖工具 Vector Creator 都來自這家公司,而他們推出的 Line Awesome 則是以 Font Awesome 做為基礎,將圖案修改為線稿圖示(Line Icons),號稱是 Font Awesome 5.11.2 絕佳替代方案,當然你也可以比較一下那種風格比較符合自己的需求。

Line Awesome

Line Awesome 可完全涵蓋 Font Awesome 主要的 1,380 個扁平化圖示圖案,圖示風格採用 Icons8 Windows 10,圖示總數超過四千個!透過 Line Awesome 網站預覽功能可以查看完整圖示集,在使用前可先檢查並確認是否有你需要的圖案。

要導入 Line Awesome 圖示集也非常簡單,網站直接給出 CDN 鏈結,只要將它放入網站就能透過樣式載入特定圖案,網站也提供打包好的完整圖示集下載,如果只需要其中幾個圖案也可考慮下載後自行托管使用。

Line Awesome
https://icons8.com/line-awesome

使用教學

STEP 1

開啟 Line Awesome 網站,就能直接預覽完整的圖示圖案,還依照不同類型分類,點選左側分類鏈結快速跳轉到特定圖案分類。比較有趣的是將游標移動到圖案上方會看到該圖示在一般或實心風格的差異,Line Awesome 所有圖案都有三種樣式,透過不同的樣式名稱來調整,這部份可以參考說明頁面的 Usage 說明。

Line Awesome

STEP 2

點選 Get Started 來到 Line Awesome 安裝說明,最簡單的方式就是直接透過內容傳遞網路服務載入這套圖案,不僅不會耗費自己的主機流量,也有加速及分流效果,如果你本來就已經使用 Font Awesome 圖示集也可利用 Line Awesome 提供的替換鏈結直接把整套圖示替換掉,原有的圖案依然可以顯示,只是風格會不同。

若你開始一個全新的專案,只要複製第二行原始碼,將它放到網頁頂部即可載入圖示包。

Line Awesome

另一種是從 Line Awesome 下載 .zip 壓縮檔,解壓縮後自行上傳、載入相關檔案。

無論你是透過 CDN 或是自己托管檔案並載入圖示集,參考底下的使用方式就會知道這套圖示圖案一樣是以樣式方式載入特定內容,再透過 CSS 去調整大小或顏色。

Line Awesome

STEP 3

那麼要如何找到某個圖案的樣式名稱呢?

開啟 Line Awesome 網站,從上方搜尋輸入要查找的圖案關鍵字,例如輸入 battery 就會顯示所有相關圖案。

Line Awesome

STEP 4

點選你要的圖案後,就會看到該圖示在不同尺寸大小的呈現樣式,從 16px 至 64px,底下則有快速複製、貼上的名稱,樣式前面的 lar、las 或 lab 分別代表 regular、solid 和 brand 三種風格,後面才接上圖示的樣式名稱。

Line Awesome

值得一試的三個理由:

  1. Icons8 修改自 Font Awesome,整體採用線稿圖示風格
  2. 收錄圖示總數量超過 4000 個以上,三種風格樣式
  3. 以 CDN 快速載入,也能自行下載托管檔案

分類:免費圖示, 素材模版, 網頁素材 標籤:CSS, Font Awesome, Icon Font, icons, Open Source, SVG, 介面開發, 免費圖標, 免費圖示, 免費素材, 免費素材集, 向量圖示, 圖示, 圖示下載, 圖示搜尋, 圖示製作, 圖示集, 應用程式開發, 熱門主題, 簡單, 素材, 素材模板, 網頁圖示, 網頁素材, 網頁設計, 線上地圖, 編輯嚴選, 編輯推薦, 開放原始碼, 開發

Avatar for Pseric

關於 Pseric

學生時代成立網站以來堅持每日更新,在挖掘資料的過程中慢慢找出自己經營網站的方法,最開心的是有一群一起長大的讀者。

主要側邊欄

使用電子郵件訂閱網站

輸入你的電子郵件地址訂閱網站新文章,使用電子郵件接收通知。

站內搜尋

最新文章

  • Moises.ai 線上去除人聲工具,從音樂音軌取出伴奏或其他樂器聲音
  • Authy 可備份的 Google Authenticator 替代方案,支援多裝置同步驗證碼
  • VaultPress 完整備份你的 WordPress 網站,無痛搬家或回復特定時間點
  • Hexometer Website Analyzer 分析網站使用那些第三方服務或工具(Chrome、Firefox)
  • Online Video Cutter 線上影片裁切工具,集合旋轉方向和調整畫質功能
  • 換新手機如何備份和轉移 Google Authenticator 兩步驟驗證資料?
  • Responsive Viewer 在單一頁面查看網頁在不同螢幕大小裝置的顯示樣貌(Chrome 擴充功能)
  • Go64 升級 macOS 10.15 前幫你檢查電腦上還有那些 32 位元應用程式

精選主題

  • 思源黑體:Adobe 與 Google 合作開發開放原始碼中文字型
  • 思源宋體 Noto Serif CJK 字型免費下載!Google、Adobe 再次攜手推出開放原始碼字體
  • Apple Music 登陸台灣!免費三個月試用音樂串流服務,不聽音樂要幹嘛?
  • [下載] WinRAR 解壓縮軟體正式推出中文免費版,別再用盜版破解版了!
  • Mipony 白馬下載器:網路下載必裝!支援數百免空可突破下載限制
  • Outline 來自 Google 全自動自架 VPN 安裝工具,突破中國網路封鎖限制
  • Cloudflare 1.1.1.1 免費公眾 DNS 服務,創造更快速、安全隱私的網路環境
  • Spotify 免費聆聽 4000 萬首歌,音樂串流應用 iOS、Android 版下載
  • Kaspersky Free 2019 卡巴斯基最新免費防毒軟體下載,改善速度、安全性和掃描技術
  • Peggo 終止服務!5 個 YouTube 轉檔下載替代方案推薦
  • 日本亞馬遜 AmazonGlobal 線上購物直送台灣,免消費稅免找代購
  • 台北黑體 Taipei Sans TC 繁體中文字型免費下載,更適合印刷的字體風格
  • PS4 Pro 更換 SSD 教學,也許最大的敵人不是魔王而是讀取速度太慢
  • 中華郵政 i郵箱初體驗,24 小時自助郵局寄件取件超方便
  • YouTube Music 免費音樂串流服務正式登場,升級 Premium 零廣告體驗

贊助商連結

實用教學

  • 46個免費圖庫網站總彙整
  • 15個免費下載高解析度圖片最佳圖庫
  • 下載高畫質相片素材的13個免費圖庫資源精選
  • 12個你應該知道的中英文假字、文章產生器
  • 20個免費下載創用 CC 授權音樂的網站彙整
  • 40個設計師必備免費資源超推懶人包
  • Google 商家被留負評該檢舉刪除?或許業主更該做的是回應疑慮
  • Facebook 全新下載資料副本功能,一次備份所有臉書記錄匯出
  • Instagram 資料下載讓使用者完整備份相片影片、留言、訊息等個人記錄
  • 7 個線上接收手機簡訊驗證碼的免費網路服務整理
  • 如何重灌 Mac 電腦?重新安裝 macOS 自動更新為最新版本教學
  • PayPal 兩步驟驗證設定教學,以手機簡訊或應用程式降低被盜用風險
  • 以 YubiKey 實體安全金鑰設定 Google 兩步驟驗證教學

WordPress 架站資源

  • 搬家自架 WordPress 推薦的五個虛擬主機服務
  • 架站更上一層樓,我推薦的五個虛擬專屬主機(VPS)服務
  • WordPress Hosting 架站空間精選,最多人推薦的五個國外虛擬主機方案
  • 如何挑選一個適合你的虛擬主機服務?我參考的七個比較項目
  • 自架 WordPress 虛擬主機租用教學,將網誌備份匯出、匯入到新家
  • 在 WordPress 設定 HTTPS,強制使用 SSL 安全加密協定教學
  • 殺手級 WordPress 體檢項目:101 個建立新網站的超簡易捷徑!
  • Cloudflare 架站者必備免費 CDN、DNS 託管服務設定教學
  • 台灣用戶也能在 Google Domains 註冊購買網域名稱,詳細申請設定教學
  • 16 個免費網站速度測試工具推薦!網頁效能評比,搜尋引擎最佳化必備
  • 亞馬遜 VPS 服務 Amazon Lightsail 搭配 ServerPilot 快速架設 WordPress 教學
  • 165 個 WordPress 官方開發佈景主題設計 Jetpack 使用者免費下載
  • 使用 Google Cloud Platform 雲端主機免費版架設 WordPress 教學
  • 使用 Cloudways 架設 WordPress 網站教學,快速部屬最佳化環境
  • RunCloud 佈署最佳化主機環境,整合 DigitalOcean 架設 WordPress 教學
  • 使用 SiteGround 虛擬主機一鍵快速安裝 WordPress 教學
  • Cloudflare 變身域名註冊商,以最低價續費含免費 SSL、WHOIS 隱藏功能
  • FastComet 評價極高的虛擬主機推薦,一鍵安裝 WordPress 教學
  • VaultPress 完整備份你的 WordPress 網站,無痛搬家或回復特定時間點

贊助商連結

Powered by Cloudways
We Love Jetpack!
Stock Photos, Vectors and Royalty Free Images from 123RF

授權方式

免費資源網路社群由 Pseric 製作,以創用 CC 姓名標示-非商業性-禁止改作 4.0 國際授權條款釋出。

  • Facebook
  • Twitter
  • LinkedIn
  • Pinterest
  • Instagram
  • RSS

免費資源網路社群使用 WordPress 建置,最高級的語意化個人出版平台・關於本站・隱私權政策