开发图标搜索器 - Devicon的HTML复制

Devicon 是一个专注于开发技术图标的开源图标库，涵盖了编程语言、框架、工具、数据库、云服务等 200+ 开发相关图标。它提供字体图标（Icon Font）和 SVG 两种使用方式，非常适合技术博客、作品集、文档站点和开发者工具中使用。与 Font Awesome 等通用图标库不同，Devicon 专门面向开发者生态。

最简单的引入方式是通过 CDN：
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/devicon.min.css">

然后在 HTML 中使用：
<i class="devicon-python-plain"></i> （单色线框风格）
<i class="devicon-python-original"></i> （彩色原始风格）

也可以通过 npm 安装：npm install devicon

Plain（线框/单色）：图标以单色线条或填充形式呈现，颜色统一，适合需要视觉一致性的界面设计。你可以通过 CSS color 属性自由更改颜色。

Original（彩色原始）：图标保留该技术的品牌原始色彩（如 Python 的蓝黄双色、MongoDB 的绿色等），色彩丰富、辨识度高，适合展示技术栈等场景。

此外还有 -wordmark 后缀版本（如 devicon-python-original-wordmark），会在图标旁附带文字标识。

由于 Devicon 字体图标本质是文字，直接使用 CSS 的 font-size 即可调整大小：
<i class="devicon-react-original" style="font-size: 48px;"></i>

图标会保持矢量清晰度，任意缩放都不会失真。你也可以使用 em、rem 等相对单位来匹配上下文文字大小。

Devicon 覆盖了非常广泛的开发技术栈，包括但不限于：
编程语言：Python、JavaScript、TypeScript、Java、Go、Rust、C/C++、Ruby、PHP、Swift、Kotlin 等
前端框架：React、Vue.js、Angular、Svelte、Next.js、Nuxt.js 等
后端框架：Django、Flask、Spring、Laravel、Express、NestJS 等
数据库：MySQL、PostgreSQL、MongoDB、Redis、SQLite 等
DevOps：Docker、Kubernetes、AWS、Azure、Nginx、Jenkins、Terraform 等
开发工具：VS Code、Git、GitHub、GitLab、Figma、npm、Webpack、Vite 等
目前图标总数已超过 200+，且持续更新中。

Font Awesome 是通用图标库（包含 UI 控件、社交媒体、箭头等日常图标），适合大多数网站的基础图标需求。
Devicon 则专精于开发技术图标，提供了 Font Awesome 中不具备的编程语言、框架、数据库等开发者专属图标。两者可以互补使用：用 Font Awesome 处理通用 UI 图标，用 Devicon 展示技术栈相关内容。

本工具页面需要联网加载 Devicon 的 CDN 样式文件才能正确渲染图标预览。但你可以将 Devicon 的 CSS 和字体文件下载到本地项目中离线使用。通过 npm 安装（npm install devicon）后，在 node_modules/devicon 目录中即可找到所有资源文件。