zhzenghui / eva-icons

A pack of more than 480 beautifully crafted Open Source icons. SVG, Sketch, Web Font and Animations support.

Home Page:https://akveo.github.io/eva-icons/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Eva Icons

Eva Icons is a pack of more than 480 beautifully crafted Open Source icons for common actions and items. Additionally Eva Icons supports 4 animation types: zoom, pulse, shake and flip. Download on desktop to use them in your digital products for Web, iOS and Android. Icons are provided in two visual types: Fill and Outline and in serveral formats, including PNG, SVG, font, Sketch, etc.

Download

CDN

Load from CDN in your project:

<script src="https://unpkg.com/eva-icons"></script>

After including the script, eva will be available as a global variable.

NPM

  • Install the package:
npm i eva-icons
  • Include it to your page:
<script src="path/to/dist/eva-icons.js"></script>
  • Or require the package (may vary depending on your build system):
const eva = require('eva-icons');
import * as eva from 'eva-icons';

How to use

JavaScript

  • Add the data-eva attribute with the icon name to an element:
<i data-eva="github"></i>
  • Call eva.replace(); to replace all elements with the data-eva data attribute with SVG elements. You can also pass some additional parameters to the replace method to modify the replace function behavior.
<!DOCTYPE html>
<html lang="en">
  <title></title>
  <script src="https://unpkg.com/eva-icons"></script>
  <body>
  
    <i data-eva="github"></i>

    <script>
      eva.replace()
    </script>
  </body>
</html>

Thanks to Feather Icons for the build process inspiration.

Fonts

Eva Icons are also available as a Web Font.

  • Include the font css into your page:
<link href="path/to/style/eva-icons.css">
  • Add eva and eva-icon classes to an element:
<i class="eva eva-github"></i>

We recommend using SVG icons due to better rendering and performance capabilities, more details.

Documentation

eva.replace({ ... })

Replaces all elements that have a data-eva attribute with SVG markup corresponding to the element's data-eva attribute value.

License

MIT license.

More from Akveo

  • Nebular - Angular Component, Auth and Security
  • ngx-admin - the best Angular admin template

How can I support the developers?

  • Star our GitHub repo ⭐
  • Create pull requests, submit bugs, suggest new features or documentation updates 🔧
  • Follow us on Twitter 🐾
  • Like our page on Facebook 👍

From Developers

Made with ❤️ by Akveo team. Follow us on Twitter to get the latest news first! We're always happy to receive your feedback!

About

A pack of more than 480 beautifully crafted Open Source icons. SVG, Sketch, Web Font and Animations support.

https://akveo.github.io/eva-icons/

License:MIT License


Languages

Language:TypeScript 47.1%Language:CSS 23.3%Language:JavaScript 19.9%Language:HTML 9.7%