500 个 CSS 图标 - css.gg

大家好

我刚刚在 Product Hunt 上发布了我的项目
：https://www.producthunt.com/posts/css-gg/

如果您觉得有趣，请考虑点赞。

网站：直接查看网站

css.gg 是一套外观简约、可定制且易于使用的图标。

整个库都是用 CSS 构建的，因此非常适合那些专注于 ⚡️ 高性能网站的人，因为它们的渲染速度非常快，此外，你还可以像编译其他样式一样编译它。

🥂 css.gg 完全免费，而且永远免费。

🛠 对于那些希望将其集成到自己的应用程序中的用户，我们提供了 API 端点，其中包含所有图标详细信息，包括样式、标记，甚至视图和 API 调用。

📖 如果您想学习和预览，每个图标都位于一个单独的页面上，您可以直接预览 CSS 代码，了解其构建方式。

🚀 性能远超其他选项，因为它完全基于 CSS，您可以将样式应用于任何类，并且它们的设计可以独立存在，不会破坏您的布局。

📏可扩展性不是问题，所有图标默认都支持 Retina 显示屏，通过代码设计，您可以根据需要将图标设置为任意尺寸，无论是作为常规图标还是背景。只需一个 CSS 变量“--ggs”即可实现神奇的缩放效果。

感谢所有支持这个项目的人，我收到的反馈让我受宠若惊，仅仅在 GitHub 上，第一天就获得了 70 多个星标。

如有需要个人演示，请联系我们。

标记

<i class="gg-icon-name"></i>

风格

 <!-- Uncompressed - Single Icon -->
<link href='https://css.gg/icon-name.css' rel='stylesheet'>

<!-- Compressed - Single Icon -->
<link href='https://css.gg/c?=|icon-name' rel='stylesheet'>

<!-- Multiple icons  -->
<link href='https://css.gg/c?=|icon-name|icon-name|icon-name' rel='stylesheet'>

<!-- All icons  -->
<link href='https://css.gg/c' rel='stylesheet'>

@进口

/* Uncompressed - Single icon */
@import url('https://css.gg/icon-name.css');

/* Compressed - Single icon*/
@import url('https://css.gg/c?=|icon-name');

/* Multiple icons */
@import url('https://css.gg/c?=|icon-name|icon-name|icon-name');

/* All icons */
@import url('https://css.gg/c');

API 参考

所有数据 - 单图标

https://css.gg/json?=|icon-name

所有数据 - 多图标

https://css.gg/json?=|icon-name|icon-name|icon-name

仅返回样式和标记

如果您只想提取样式或标记，则需要在 URL 末尾分别使用 &op=css 或 &op=css+markup 变量进行指定。

如何调整图标大小

/* To resize an icon you just need to change the number of a css variable "--ggs" to any number 
you like if not specified it falls back to 1 or the actual size. */
.gg-icon-name {
    /* This value will multiple the actual size  */
    --ggs: 10;
}

/* The variable can be added to the parent,
custom class,body or root level if you want all icons same size. */
:root {
    --ggs: 6;
}

CDN替代方案

JSON
https://unpkg.com/css.gg
https://cdn.jsdelivr.net/npm/css.gg

CSS
https://unpkg.com/css.gg/icons-compressed/icons.css
https://cdn.jsdelivr.net/npm/css.gg/icons-compressed/icons.css

XML
https://unpkg.com/css.gg/icons-xml/icons.xml
https://cdn.jsdelivr.net/npm/css.gg/icons-xml/icons.xml