图标聚合搜索工具：中文关键词检索 Iconify 图标库

作品简介

图标聚合搜索是一个单文件纯前端网页工具，所有 HTML/CSS/JavaScript 都内联在一个 HTML 文件中，无框架依赖、无构建步骤。它对接 Iconify 开放 API，把多个开源图标库聚合到一个搜索框里：输入中文分类词（如“按钮”“窗口”“箭头”）会自动展开为一组英文同义词并行检索，解决“知道用途却不知道图标英文名”的找图难题。

页面顶部以「图标 / Emoji」两个 Tab 切换两块功能面板：图标页提供关键词搜索、18 个常用中文分类、类型（线性/填充/双色/多色）筛选、图标源勾选、颜色与尺寸调节及两列/单列视图；Emoji 副页则内置 twemoji、noto、openmoji、fxemoji、emojione 五套 Emoji 库与表情、手势、食物、动物等快捷分类。找到目标后单击图标即可下载 SVG 或复制 PNG，直接用于界面开发。

核心亮点

• 中文直接找图标：内置 18 个常用界面中文分类（按钮、窗口、开关、输入框、搜索、箭头等），点击即按英文词族自动展开并行检索，无需记忆英文单词
• 多库聚合分组展示：一次搜索同时返回 tabler、heroicons、simple-icons、devicon 等多个图标源的结果，按库名分组显示数量、分类与作者信息
• 取图即点即得：单击图标即可下载 SVG 或复制 PNG，下载链接可实时携带所选颜色（十六进制色值）与尺寸参数
• 类型与视图筛选：按线性/填充/双色/多色启发式过滤图标风格，支持两列瀑布流与单列视图切换
• 一键检索高频图标：顶部「常用界面图标」按钮可一键搜索 window、button、menu、checkbox 等 36 个界面开发高频词
• Emoji 副页：五套 Emoji 图标库可选，按表情、手势、工具物品、箭头符号、旗帜、食物、动物、交通、天气等分类浏览，适合组装聊天类控件
• 单文件零依赖：整个工具就是一份 HTML 文件，便于分发与备份，本地起一个静态服务即可使用

技术与工具

• 技术方案：单文件原生 HTML/CSS/JavaScript，无框架、无构建，使用 getElementById 与事件委托等原生 DOM 操作
• 数据源：Iconify API（api.iconify.design，免鉴权、CORS 开放），搜索接口按库并行请求；工具针对“逗号多词查询返回 0”的限制，将中文分类展开为多个单次请求并行检索
• 运行方式：推荐 python -m http.server 起本地静态服务后通过 HTTP 访问，直接 file:// 打开可能被跨域拦截
• 开发工具：办公智能体工具（WorkBuddy/Trae Work/Kimi Work/千问办公等）
• AI 模型：国内其他模型（免费使用为主）

适用场景

• 软件界面设计与前端开发中需要快速找到风格匹配的开源图标时
• 不熟悉图标英文名、想用中文描述直接找图的初学者
• 需要挑选 Emoji 表情用于聊天控件、状态提示等场景
• 离线分发：单 HTML 文件便于拷贝给同事，联上网络即可使用全部检索能力

原始提交内容（点开查看，可复制全文去问 AI）

一、工具简介 项目 说明 文件 图标聚合搜索.html（单文件，无任何外部依赖，可离线查看界面） 数据源 Iconify API（api.iconify.design，免鉴权、CORS 开放） 语言 中文界面，支持中 / 英文检索 运行方式 本地静态服务（推荐）或直接双击打开 定位 面向软件界面设计与开发场景的图标快速检索、筛选、取用工具 核心能力一句话：不用记住英文单词也能找图标——输入“按钮 / 窗口 / 箭头”等中文分类即可检索；找到后单击即得 SVG 或 PNG，方便直接用于界面开发。

二、快速开始（运行方式） 工具依赖 Iconify 在线 API 获取图标，因此需要通过 HTTP 访问（直接双击 file:// 打开时，跨域请求可能被拦截，推荐本地服务方式）。

cd D:\编程开发\开源项目\网页项目\ICO图标检索功能 python -m http.server 8898 –bind 127.0.0.1 浏览器访问：

http://127.0.0.1:8898/图标聚合搜索.html 修改 HTML 后如需强制刷新：按 Ctrl+F5，或在地址后追加 ?v=<时间戳> 绕过缓存。

三、界面结构总览 页面顶部通过 「图标 / Emoji」 两个 Tab 切换两个功能面板，右上角始终有「关于」按钮。

[图标] [Emoji] 图标聚合搜索 [关于]

[搜索框] [搜索] [常用界面图标] 搜索行 中文分类：按钮 窗口 开关 输入框 搜索 箭头 …（18个快捷分类） 分类栏 类型：全部 线性 填充 双色 多色 颜色 尺寸 视图 两列/单列 单击复制图片 类型/工具栏 图标源：[全选] tabler heroicons simple-icons devicon … 源筛选栏

图标结果区：按图标源分组，左右两列瀑布流 / 上下单列
每个分组：库名 + 数量 + 分类 + 作者
每个图标卡片：图标预览 + 名称

Emoji 副页结构类似：搜索行 + 快捷分类栏（表情/手势/工具物品/箭头符号/旗帜/食物/动物/交通/天气）+ Emoji 库选择（twemoji / noto / openmoji / fxemoji / emojione）+ 尺寸调节。

四、图标主页功能详解 4.1 关键词搜索 英文关键词：直接输入，如 pin、lock、bell。 中文关键词：直接输入“按钮 / 窗口”等，工具会自动展开为一组英文同义词并行检索（见第七章词表）。 多个关键词：可用英文逗号分隔，如 pin,keep,lock。 回车或点击「搜索」触发；顶部「常用界面图标」按钮可一键检索软件界面高频图标（window/button/menu/checkbox 等 36 个词）。 4.2 中文分类浏览 分类栏内置 18 个常用中文分类，单击即按该分类的英文词族检索，适合“知道用途但不知道英文名”的场景：