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

Category: CSS & CSS3 , Recommended | January 16, 2020
Author: astrit
Views Total: 109
Official Page: Go to website
Last Update: January 16, 2020
License: MIT

Preview:

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

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.

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:

v1.0.6 (01/16/2020)

  • Fix: Dribbble Gradient outdated direction syntax

v1.0.5 (01/13/2020)

  • Fix: Gradient outdated direction syntax

You Might Be Interested In:


Leave a Reply