What is this?
CSS.GG is a comprehensive open-source icon library: 700+ UI icons written in pure CSS, plus matching SVG versions and a Figma collection.
CSS.GG is a comprehensive open-source icon library: 700+ UI icons written in pure CSS, plus matching SVG versions and a Figma collection.Is it an icon font, or how do the icons actually work?No font files and no JavaScript: each icon is a pure CSS class you drop on an element, with SVG and Figma versions provided alongside.
No font files and no JavaScript: each icon is a pure CSS class you drop on an element, with SVG and Figma versions provided alongside.How do I get the icons into my project?Browse the icons on the css.gg website and copy-paste the CSS you need, install the npm package, or take the SVG and Figma assets directly.
Browse the icons on the css.gg website and copy-paste the CSS you need, install the npm package, or take the SVG and Figma assets directly.Do I need any framework or build tools to use it?Nothing beyond HTML and CSS. The icons are vanilla CSS and SVG, so any web stack or framework works without a build step.
Nothing beyond HTML and CSS. The icons are vanilla CSS and SVG, so any web stack or framework works without a build step.Is it just the 700 icons, or is there more in the collection?There is also GLYF, a collection of well-organised 6000+ unique glyphs, plus patterns, colors and layouts. Everything is easy copy-paste, and a Raycast extension gives quick access to the icons.
There is also GLYF, a collection of well-organised 6000+ unique glyphs, plus patterns, colors and layouts. Everything is easy copy-paste, and a Raycast extension gives quick access to the icons.Can I use these icons inside Figma?Yes — Figma UI icons ship with the library, so you can drop them straight into design files.
Yes — Figma UI icons ship with the library, so you can drop them straight into design files.Does it work with React and styled-components?styled-components is listed among the project's supported topics, and since the icons are plain CSS and SVG they drop into any framework, React included.
styled-components is listed among the project's supported topics, and since the icons are plain CSS and SVG they drop into any framework, React included.Is the project still being updated?Yes — a new version went live on the website in August 2024 with a new design and a new way to browse icons, and a Figma plugin plus a new library release were announced as coming soon.
Yes — a new version went live on the website in August 2024 with a new design and a new way to browse icons, and a Figma plugin plus a new library release were announced as coming soon.What are similar projects?Font-Awesome, heroicons, tabler-icons, react-icons, lucide, material-design-icons, styled-components, MaterialDesign
Font-Awesome, heroicons, tabler-icons, react-icons, lucide, material-design-icons, styled-components, MaterialDesign