css 商城 两列_所有前端开发人员想要的纯 CSS 图标库

Adobe 设计师张雯婷创建了一个有趣的 Web 应用程序，用于生成纯 CSS 图标。它简称为“CSS ICON”，它可能是前端开发人员最酷的图标生成器之一。

该项目是完全免费的，并且在 GitHub 上开源，因此你可以自由下载和使用任何代码。下载地址：

https://github.com/wentin/cssicon

这些图标没有任何 CSS 依赖性，也不需要任何特殊的浏览器功能。乍一看，这些图标似乎是基于 SVG 构建的，但实际上它们只是 divs。

通过 CSS，你可以为常见的界面元素构建自定义线图标。

你可以在细线图标或深色图标之间进行选择。它们都利用相似的 CSS 属性，你甚至可以通过单击列表中的任何图标来查看它们的含义。你会看到一个带有 HTML 和 CSS 代码的滑动侧栏以及放大的图标。

如果你朝着代码字段的右上角看，会看到一个小复制图标。单击该代码可将代码自动复制到剪贴板。

要更改任何图标的颜色，只需在主图标类中找到 color 属性。更新一个 color 属性也会改变其他所有属性。

由于这些图标非常简单，因此可能不适用于每个网站。但这是图像或图标字体的很酷的替代方法，它是完全免费的。

请登录 CSSIcon 主页(https://cssicon.space/#/)以查看更多示例并复制或编辑源代码。如果你想在浏览器中使用源代码，还可以在 CodePen 中(http://codepen.io/pen?&editors=110)分别测试每个图标 。