FontAwesome图标查询：类名与Unicode | 工具匠

FontAwesome图标查询：类名与Unicode | 工具匠

tools.fontawesome-icons-query.inputs.keywordLabel

tools.fontawesome-icons-query.inputs.styleLabel

tools.fontawesome-icons-query.tips.cdnNotice

tools.fontawesome-icons-query.results.countLabel

tools.fontawesome-icons-query.tips.loading

fa-house

tools.fontawesome-icons-query.styles.solid · U+F015

tools.fontawesome-icons-query.tips.loading

fa-user

tools.fontawesome-icons-query.styles.solid · U+F007

tools.fontawesome-icons-query.tips.loading

fa-users

tools.fontawesome-icons-query.styles.solid · U+F0C0

tools.fontawesome-icons-query.tips.loading

fa-user-plus

tools.fontawesome-icons-query.styles.solid · U+F234

tools.fontawesome-icons-query.tips.loading

fa-user-minus

tools.fontawesome-icons-query.styles.solid · U+F503

tools.fontawesome-icons-query.tips.loading

fa-envelope

tools.fontawesome-icons-query.styles.solid · U+F0E0

tools.fontawesome-icons-query.tips.loading

fa-phone

tools.fontawesome-icons-query.styles.solid · U+F095

tools.fontawesome-icons-query.tips.loading

fa-magnifying-glass

tools.fontawesome-icons-query.styles.solid · U+F002

tools.fontawesome-icons-query.tips.loading

fa-bell

tools.fontawesome-icons-query.styles.solid · U+F0F3

tools.fontawesome-icons-query.tips.loading

fa-gear

tools.fontawesome-icons-query.styles.solid · U+F013

tools.fontawesome-icons-query.tips.loading

fa-heart

tools.fontawesome-icons-query.styles.solid · U+F004

tools.fontawesome-icons-query.tips.loading

fa-star

tools.fontawesome-icons-query.styles.solid · U+F005

tools.fontawesome-icons-query.tips.loading

fa-bookmark

tools.fontawesome-icons-query.styles.solid · U+F02E

tools.fontawesome-icons-query.tips.loading

fa-calendar

tools.fontawesome-icons-query.styles.solid · U+F133

tools.fontawesome-icons-query.tips.loading

fa-calendar-days

tools.fontawesome-icons-query.styles.solid · U+F073

tools.fontawesome-icons-query.tips.loading

fa-clock

tools.fontawesome-icons-query.styles.solid · U+F017

tools.fontawesome-icons-query.tips.loading

fa-hourglass

tools.fontawesome-icons-query.styles.solid · U+F254

tools.fontawesome-icons-query.tips.loading

fa-map

tools.fontawesome-icons-query.styles.solid · U+F279

tools.fontawesome-icons-query.tips.loading

fa-location-dot

tools.fontawesome-icons-query.styles.solid · U+F3C5

tools.fontawesome-icons-query.tips.loading

fa-compass

tools.fontawesome-icons-query.styles.solid · U+F14E

tools.fontawesome-icons-query.tips.loading

fa-globe

tools.fontawesome-icons-query.styles.solid · U+F0AC

tools.fontawesome-icons-query.tips.loading

fa-image

tools.fontawesome-icons-query.styles.solid · U+F03E

tools.fontawesome-icons-query.tips.loading

fa-images

tools.fontawesome-icons-query.styles.solid · U+F302

tools.fontawesome-icons-query.tips.loading

fa-camera

tools.fontawesome-icons-query.styles.solid · U+F030

tools.fontawesome-icons-query.tips.loading

fa-video

tools.fontawesome-icons-query.styles.solid · U+F03D

tools.fontawesome-icons-query.tips.loading

fa-music

tools.fontawesome-icons-query.styles.solid · U+F001

tools.fontawesome-icons-query.tips.loading

fa-play

tools.fontawesome-icons-query.styles.solid · U+F04B

tools.fontawesome-icons-query.tips.loading

fa-pause

tools.fontawesome-icons-query.styles.solid · U+F04C

tools.fontawesome-icons-query.tips.loading

fa-stop

tools.fontawesome-icons-query.styles.solid · U+F04D

tools.fontawesome-icons-query.tips.loading

fa-forward

tools.fontawesome-icons-query.styles.solid · U+F04E

tools.fontawesome-icons-query.tips.loading

fa-backward

tools.fontawesome-icons-query.styles.solid · U+F04A

tools.fontawesome-icons-query.tips.loading

fa-volume-high

tools.fontawesome-icons-query.styles.solid · U+F028

tools.fontawesome-icons-query.tips.loading

fa-volume-xmark

tools.fontawesome-icons-query.styles.solid · U+F6A9

tools.fontawesome-icons-query.tips.loading

fa-microphone

tools.fontawesome-icons-query.styles.solid · U+F130

tools.fontawesome-icons-query.tips.loading

fa-headphones

tools.fontawesome-icons-query.styles.solid · U+F025

tools.fontawesome-icons-query.tips.loading

fa-file

tools.fontawesome-icons-query.styles.solid · U+F15B

tools.fontawesome-icons-query.tips.loading

fa-file-lines

tools.fontawesome-icons-query.styles.solid · U+F15C

tools.fontawesome-icons-query.tips.loading

fa-folder

tools.fontawesome-icons-query.styles.solid · U+F07B

tools.fontawesome-icons-query.tips.loading

fa-folder-open

tools.fontawesome-icons-query.styles.solid · U+F07C

tools.fontawesome-icons-query.tips.loading

fa-floppy-disk

tools.fontawesome-icons-query.styles.solid · U+F0C7

tools.fontawesome-icons-query.tips.loading

fa-download

tools.fontawesome-icons-query.styles.solid · U+F019

tools.fontawesome-icons-query.tips.loading

fa-upload

tools.fontawesome-icons-query.styles.solid · U+F093

tools.fontawesome-icons-query.tips.loading

fa-cloud

tools.fontawesome-icons-query.styles.solid · U+F0C2

tools.fontawesome-icons-query.tips.loading

fa-cloud-arrow-up

tools.fontawesome-icons-query.styles.solid · U+F0EE

tools.fontawesome-icons-query.tips.loading

fa-cloud-arrow-down

tools.fontawesome-icons-query.styles.solid · U+F0ED

tools.fontawesome-icons-query.tips.loading

fa-trash

tools.fontawesome-icons-query.styles.solid · U+F1F8

tools.fontawesome-icons-query.tips.loading

fa-trash-can

tools.fontawesome-icons-query.styles.solid · U+F2ED

tools.fontawesome-icons-query.tips.loading

fa-pen

tools.fontawesome-icons-query.styles.solid · U+F304

tools.fontawesome-icons-query.tips.loading

fa-pencil

tools.fontawesome-icons-query.styles.solid · U+F303

tools.fontawesome-icons-query.tips.loading

fa-pen-to-square

tools.fontawesome-icons-query.styles.solid · U+F044

tools.fontawesome-icons-query.tips.loading

fa-scissors

tools.fontawesome-icons-query.styles.solid · U+F0C4

tools.fontawesome-icons-query.tips.loading

fa-copy

tools.fontawesome-icons-query.styles.solid · U+F0C5

tools.fontawesome-icons-query.tips.loading

fa-paste

tools.fontawesome-icons-query.styles.solid · U+F0EA

tools.fontawesome-icons-query.tips.loading

fa-link

tools.fontawesome-icons-query.styles.solid · U+F0C1

tools.fontawesome-icons-query.tips.loading

fa-share

tools.fontawesome-icons-query.styles.solid · U+F064

tools.fontawesome-icons-query.tips.loading

fa-share-nodes

tools.fontawesome-icons-query.styles.solid · U+F1E0

tools.fontawesome-icons-query.tips.loading

fa-print

tools.fontawesome-icons-query.styles.solid · U+F02F

tools.fontawesome-icons-query.tips.loading

fa-lock

tools.fontawesome-icons-query.styles.solid · U+F023

tools.fontawesome-icons-query.tips.loading

fa-unlock

tools.fontawesome-icons-query.styles.solid · U+F09C

tools.fontawesome-icons-query.tips.loading

fa-key

tools.fontawesome-icons-query.styles.solid · U+F084

tools.fontawesome-icons-query.tips.loading

fa-eye

tools.fontawesome-icons-query.styles.solid · U+F06E

tools.fontawesome-icons-query.tips.loading

fa-eye-slash

tools.fontawesome-icons-query.styles.solid · U+F070

tools.fontawesome-icons-query.tips.loading

fa-check

tools.fontawesome-icons-query.styles.solid · U+F00C

tools.fontawesome-icons-query.tips.loading

fa-xmark

tools.fontawesome-icons-query.styles.solid · U+F00D

tools.fontawesome-icons-query.tips.loading

fa-plus

tools.fontawesome-icons-query.styles.solid · U+2B

tools.fontawesome-icons-query.tips.loading

fa-minus

tools.fontawesome-icons-query.styles.solid · U+F068

tools.fontawesome-icons-query.tips.loading

fa-circle-check

tools.fontawesome-icons-query.styles.solid · U+F058

tools.fontawesome-icons-query.tips.loading

fa-circle-xmark

tools.fontawesome-icons-query.styles.solid · U+F057

tools.fontawesome-icons-query.tips.loading

fa-circle-info

tools.fontawesome-icons-query.styles.solid · U+F05A

tools.fontawesome-icons-query.tips.loading

fa-circle-exclamation

tools.fontawesome-icons-query.styles.solid · U+F06A

tools.fontawesome-icons-query.tips.loading

fa-triangle-exclamation

tools.fontawesome-icons-query.styles.solid · U+F071

tools.fontawesome-icons-query.tips.loading

fa-circle-question

tools.fontawesome-icons-query.styles.solid · U+F059

tools.fontawesome-icons-query.tips.loading

fa-arrow-up

tools.fontawesome-icons-query.styles.solid · U+F062

tools.fontawesome-icons-query.tips.loading

fa-arrow-down

tools.fontawesome-icons-query.styles.solid · U+F063

tools.fontawesome-icons-query.tips.loading

fa-arrow-left

tools.fontawesome-icons-query.styles.solid · U+F060

tools.fontawesome-icons-query.tips.loading

fa-arrow-right

tools.fontawesome-icons-query.styles.solid · U+F061

tools.fontawesome-icons-query.tips.loading

fa-arrow-up-right-from-square

tools.fontawesome-icons-query.styles.solid · U+F08E

tools.fontawesome-icons-query.tips.loading

fa-arrows-rotate

tools.fontawesome-icons-query.styles.solid · U+F021

tools.fontawesome-icons-query.tips.loading

fa-rotate-left

tools.fontawesome-icons-query.styles.solid · U+F2EA

tools.fontawesome-icons-query.tips.loading

fa-rotate-right

tools.fontawesome-icons-query.styles.solid · U+F2F9

tools.fontawesome-icons-query.tips.loading

fa-bars

tools.fontawesome-icons-query.styles.solid · U+F0C9

tools.fontawesome-icons-query.tips.loading

fa-list

tools.fontawesome-icons-query.styles.solid · U+F03A

tools.fontawesome-icons-query.tips.loading

fa-filter

tools.fontawesome-icons-query.styles.solid · U+F0B0

tools.fontawesome-icons-query.tips.loading

fa-table

tools.fontawesome-icons-query.styles.solid · U+F0CE

tools.fontawesome-icons-query.tips.loading

fa-chart-bar

tools.fontawesome-icons-query.styles.solid · U+F080

tools.fontawesome-icons-query.tips.loading

fa-chart-pie

tools.fontawesome-icons-query.styles.solid · U+F200

tools.fontawesome-icons-query.tips.loading

fa-chart-line

tools.fontawesome-icons-query.styles.solid · U+F201

tools.fontawesome-icons-query.tips.loading

fa-cart-shopping

tools.fontawesome-icons-query.styles.solid · U+F07A

tools.fontawesome-icons-query.tips.loading

fa-bag-shopping

tools.fontawesome-icons-query.styles.solid · U+F290

tools.fontawesome-icons-query.tips.loading

fa-credit-card

tools.fontawesome-icons-query.styles.solid · U+F09D

tools.fontawesome-icons-query.tips.loading

fa-money-bill

tools.fontawesome-icons-query.styles.solid · U+F0D6

tools.fontawesome-icons-query.tips.loading

fa-wallet

tools.fontawesome-icons-query.styles.solid · U+F555

tools.fontawesome-icons-query.tips.loading

fa-gift

tools.fontawesome-icons-query.styles.solid · U+F06B

tools.fontawesome-icons-query.tips.loading

fa-tag

tools.fontawesome-icons-query.styles.solid · U+F02B

tools.fontawesome-icons-query.tips.loading

fa-tags

tools.fontawesome-icons-query.styles.solid · U+F02C

tools.fontawesome-icons-query.tips.loading

fa-thumbs-up

tools.fontawesome-icons-query.styles.solid · U+F164

tools.fontawesome-icons-query.tips.loading

fa-thumbs-down

tools.fontawesome-icons-query.styles.solid · U+F165

tools.fontawesome-icons-query.tips.loading

fa-comment

tools.fontawesome-icons-query.styles.solid · U+F075

tools.fontawesome-icons-query.tips.loading

fa-comments

tools.fontawesome-icons-query.styles.solid · U+F086

tools.fontawesome-icons-query.tips.loading

fa-paper-plane

tools.fontawesome-icons-query.styles.solid · U+F1D8

tools.fontawesome-icons-query.tips.loading

fa-code

tools.fontawesome-icons-query.styles.solid · U+F121

tools.fontawesome-icons-query.tips.loading

fa-terminal

tools.fontawesome-icons-query.styles.solid · U+F120

tools.fontawesome-icons-query.tips.loading

fa-database

tools.fontawesome-icons-query.styles.solid · U+F1C0

tools.fontawesome-icons-query.tips.loading

fa-server

tools.fontawesome-icons-query.styles.solid · U+F233

tools.fontawesome-icons-query.tips.loading

fa-desktop

tools.fontawesome-icons-query.styles.solid · U+F390

tools.fontawesome-icons-query.tips.loading

fa-mobile-screen

tools.fontawesome-icons-query.styles.solid · U+F3CF

tools.fontawesome-icons-query.tips.loading

fa-laptop

tools.fontawesome-icons-query.styles.solid · U+F109

tools.fontawesome-icons-query.tips.loading

fa-wifi

tools.fontawesome-icons-query.styles.solid · U+F1EB

tools.fontawesome-icons-query.tips.loading

fa-bluetooth

tools.fontawesome-icons-query.styles.brands · U+F293

tools.fontawesome-icons-query.tips.loading

fa-battery-full

tools.fontawesome-icons-query.styles.solid · U+F240

tools.fontawesome-icons-query.tips.loading

fa-plug

tools.fontawesome-icons-query.styles.solid · U+F1E6

tools.fontawesome-icons-query.tips.loading

fa-sun

tools.fontawesome-icons-query.styles.solid · U+F185

tools.fontawesome-icons-query.tips.loading

fa-moon

tools.fontawesome-icons-query.styles.solid · U+F186

tools.fontawesome-icons-query.tips.loading

fa-cloud-sun

tools.fontawesome-icons-query.styles.solid · U+F6C4

tools.fontawesome-icons-query.tips.loading

fa-umbrella

tools.fontawesome-icons-query.styles.solid · U+F0E9

tools.fontawesome-icons-query.tips.loading

fa-fire

tools.fontawesome-icons-query.styles.solid · U+F06D

tools.fontawesome-icons-query.tips.loading

fa-leaf

tools.fontawesome-icons-query.styles.solid · U+F06C

tools.fontawesome-icons-query.tips.loading

fa-tree

tools.fontawesome-icons-query.styles.solid · U+F1BB

tools.fontawesome-icons-query.tips.loading

fa-github

tools.fontawesome-icons-query.styles.brands · U+F09B

tools.fontawesome-icons-query.tips.loading

fa-gitlab

tools.fontawesome-icons-query.styles.brands · U+F296

tools.fontawesome-icons-query.tips.loading

fa-google

tools.fontawesome-icons-query.styles.brands · U+F1A0

tools.fontawesome-icons-query.tips.loading

fa-twitter

tools.fontawesome-icons-query.styles.brands · U+F099

tools.fontawesome-icons-query.tips.loading

fa-x-twitter

tools.fontawesome-icons-query.styles.brands · U+E61B

tools.fontawesome-icons-query.tips.loading

fa-facebook

tools.fontawesome-icons-query.styles.brands · U+F09A

tools.fontawesome-icons-query.tips.loading

fa-instagram

tools.fontawesome-icons-query.styles.brands · U+F16D

tools.fontawesome-icons-query.tips.loading

fa-linkedin

tools.fontawesome-icons-query.styles.brands · U+F08C

tools.fontawesome-icons-query.tips.loading

fa-youtube

tools.fontawesome-icons-query.styles.brands · U+F167

tools.fontawesome-icons-query.tips.loading

fa-discord

tools.fontawesome-icons-query.styles.brands · U+F392

tools.fontawesome-icons-query.tips.loading

fa-slack

tools.fontawesome-icons-query.styles.brands · U+F198

tools.fontawesome-icons-query.tips.loading

fa-telegram

tools.fontawesome-icons-query.styles.brands · U+F2C6

tools.fontawesome-icons-query.tips.loading

fa-weixin

tools.fontawesome-icons-query.styles.brands · U+F1D7

tools.fontawesome-icons-query.tips.loading

fa-weibo

tools.fontawesome-icons-query.styles.brands · U+F18A

tools.fontawesome-icons-query.tips.loading

fa-qq

tools.fontawesome-icons-query.styles.brands · U+F1D6

tools.fontawesome-icons-query.tips.loading

fa-tiktok

tools.fontawesome-icons-query.styles.brands · U+E07B

tools.fontawesome-icons-query.tips.loading

fa-chrome

tools.fontawesome-icons-query.styles.brands · U+F268

tools.fontawesome-icons-query.tips.loading

fa-firefox

tools.fontawesome-icons-query.styles.brands · U+F269

tools.fontawesome-icons-query.tips.loading

fa-safari

tools.fontawesome-icons-query.styles.brands · U+F267

tools.fontawesome-icons-query.tips.loading

fa-edge

tools.fontawesome-icons-query.styles.brands · U+F282

tools.fontawesome-icons-query.tips.loading

fa-apple

tools.fontawesome-icons-query.styles.brands · U+F179

tools.fontawesome-icons-query.tips.loading

fa-windows

tools.fontawesome-icons-query.styles.brands · U+F17A

tools.fontawesome-icons-query.tips.loading

fa-linux

tools.fontawesome-icons-query.styles.brands · U+F17C

tools.fontawesome-icons-query.tips.loading

fa-android

tools.fontawesome-icons-query.styles.brands · U+F17B

tools.fontawesome-icons-query.tips.loading

fa-node-js

tools.fontawesome-icons-query.styles.brands · U+F3D3

tools.fontawesome-icons-query.tips.loading

fa-react

tools.fontawesome-icons-query.styles.brands · U+F41B

tools.fontawesome-icons-query.tips.loading

fa-vuejs

tools.fontawesome-icons-query.styles.brands · U+F41F

tools.fontawesome-icons-query.tips.loading

fa-angular

tools.fontawesome-icons-query.styles.brands · U+F420

tools.fontawesome-icons-query.tips.loading

fa-python

tools.fontawesome-icons-query.styles.brands · U+F3E2

tools.fontawesome-icons-query.tips.loading

fa-java

tools.fontawesome-icons-query.styles.brands · U+F4E4

tools.fontawesome-icons-query.tips.loading

fa-js

tools.fontawesome-icons-query.styles.brands · U+F3B8

tools.fontawesome-icons-query.tips.loading

fa-html5

tools.fontawesome-icons-query.styles.brands · U+F13B

tools.fontawesome-icons-query.tips.loading

fa-css3

tools.fontawesome-icons-query.styles.brands · U+F13C

tools.fontawesome-icons-query.tips.loading

fa-docker

tools.fontawesome-icons-query.styles.brands · U+F395

tools.fontawesome-icons-query.tips.loading

fa-aws

tools.fontawesome-icons-query.styles.brands · U+F375

tools.fontawesome-icons-query.tips.loading

fa-stack-overflow

tools.fontawesome-icons-query.styles.brands · U+F16C

tools.fontawesome-icons-query.tips.loading

fa-npm

tools.fontawesome-icons-query.styles.brands · U+F3D4

tools.fontawesome-icons-query.tips.loading

fa-yarn

tools.fontawesome-icons-query.styles.brands · U+F7E3

tools.fontawesome-icons-query.tips.loading

fa-git

tools.fontawesome-icons-query.styles.brands · U+F1D3

標籤：

FontAwesome图标查询器：核心功能与原理

在前端开发中，手动从数百个FontAwesome图标中寻找合适的图标代码往往费时费力。本工具通过内置完整的FontAwesome图标库，支持按关键词实时搜索图标，为用户快速返回图标的CSS类名、Unicode字符以及HTML使用示例，帮助开发者高效集成图标。

为什么选择我们的FontAwesome图标查询器？

即时搜索：输入图标名称或关键词，毫秒级过滤出匹配图标，无需翻阅文档。
多格式输出：每个图标均提供类名（如fas fa-user）、Unicode（如f007）及标签示例，满足不同场景集成需求。

复制便捷：一键点击即可复制所需代码，减少手动输入错误，提升开发效率。

工具教程

在搜索框中输入图标关键词，例如“user”、“搜索”、“心”等，工具自动展示匹配的图标列表。

浏览结果，找到目标图标。结果中显示图标预览、类名和Unicode编码。

点击“复制类名”或“复制Unicode”按钮，即可将代码复制到剪贴板，直接粘贴到HTML或CSS文件中使用。

示例输入：关键词“home”
输出结果：类名 fas fa-home，Unicode f015，HTML示例

常见问题FAQ：

如何区分免费版（Free）和专业版（Pro）图标？ 本工具默认展示免费图标集，若需要Pro图标可前往FontAwesome官网查看授权。

复制后为何图标不显示？ 请确保页面已引入FontAwesome CSS文件（如CDN），并且类名格式正确。常见原因包括未引入样式库或类名拼写错误。

注意事项

搜索功能基于图标名称和别名，支持中英文关键词，但输入特殊字符可能无法匹配。本工具仅提供图标代码，不包含样式文件引入服务，请自行在项目中加载FontAwesome资源。所有图标信息来源于FontAwesome公开数据，仅供学习与开发使用。

专业技术笔记 / 使用建议

建议在项目中通过类名方式引用图标，以保持样式统一和缓存优势。若需动态改变图标，可通过JavaScript修改元素的className或设置innerHTML为对应的Unicode。对于需要兼容旧浏览器的场景，可使用标签配合CSS font-family 和伪元素，减少DOM节点。示例： 并定义 .icon { font-family: 'Font Awesome 5 Free'; font-weight: 900; }。