500+ Customizable Retina-ready Icons In CSS – css.gg

Preview:

Description:

css.gg is a collection of 500+ customizable, retina-ready line (stroke) icons for modern UI/UX/Web/Mobile design.

More features:

• Allows to import as CSS, XML, or JSON.
• Allows to import single or multiple icons you specify.
• CDN available.
• Components for ReactJS, Figma, and Adobe XD

Icon Categories:

• Alerts
• Arrows
• Brands
• Buttons
• Code
• Content
• Design
• Devices
• Files
• Interface
• Maths
• Multimedia
• Music
• Shapes
• Shopping
• Signs
• Time

How to use it:

1. Install the package.

# NPM
$ npm install css.gg --save

2. Import the css.gg.

<!-- All Icons -->
<link href='icons-compressed/icons.css' rel='stylesheet'>
<!-- Or Specific Icons -->
<link href='icons/ICON-NAME.css' rel='stylesheet'>
<!-- Or From A CDN -->
<link href='https://cdn.jsdelivr.net/npm/css.gg/icons-compressed/icons.css' rel='stylesheet'>
<link href='https://cdn.jsdelivr.net/npm/css.gg/icons/ICON-NAME.css' rel='stylesheet'>

3. Embed an icon into your web page using <i> element. Click here to search and find all possible icons.

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

4. Change the icon size.

.gg-icon-name {
  --ggs: 2;
}
/* OR GLOBALLY */
:root {
  --ggs: 3;
}

Changelog:

v2.1.1 (06/24/2023)

• PNG version added black and white 1400 assets
• Bug fixes
• 6000 unique glyphs

v2.0.0 (04/23/2020)

• 200 New Icons
• New components for ReactJS, Figma, and Adobe XD

v1.0.6 (01/16/2020)

• Fix: Dribbble Gradient outdated direction syntax

v1.0.5 (01/13/2020)

• Fix: Gradient outdated direction syntax