/sketch-iconfont

This plugin helps you easily insert and manage icons from icon fonts.
  1. JavaScript 100.0%
JavaScript

Clone with HTTPS

Use Git or checkout with SVN using the web URL.

Open in Desktop Download ZIP
Find file
Switch branches/tags
Nothing to show
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
iconfont.sketchplugin/Contents
.gitignore
HELP.md
README.md

README.md

Latest Version Join the chat at https://gitter.im/keremciu/sketch-iconfont

New Feature - 29 April 2016

demo

Your teammates don't have your icon-fonts? don't worry now you can convert all icons with one command then share it.

Use Icon Fonts in Sketch

This plugin helps you easily insert and manage icons from icon fonts - such as FontAwesome, Ion or Material Design Icons - in your Sketch designs.

Use any icon font.

The plugin itself has no font built-in. You will need to download and install the fonts you wish to use directly from the font publisher. The most popular ones, however, have been put into a bundle which you can easily download from here: https://github.com/keremciu/font-bundles

=======

- Features

Why you need to use it

For The Designer: When a designer wants to add an icon from an icon font - such as material design, fontawesome, etc. - they usually need to find a cheatsheet containing all the font's icons, and then manually copy+paste each one they wish to use into their design - or use a third-party application. Time consuming and cumbersome.

  • You can now easily view and add any icon directly Sketch!

For The Developer: When a developer wants to find out the name of an icon that was used by the Designer, they need to search through a lengthy list of icons, until they find it. Time consuming and cumbersome.

  • You can now easily find out an icon's name directly in Sketch, without needing to perform a search!

=======

- Installation

Using Sketch Toolbox

  1. Install 'Sketch Iconfont' plugin directly from Sketch Toolbox.
  2. Install a font containing an svg font file, or install a font bundle - such as the one provided here: https://github.com/keremciu/font-bundles

Manually

  1. Download and extract the ZIP bundle of this plugin from this repo.
  2. Put the folder into your Sketch plugin folder (Use Plugins > Reveal Plugins Folder to find the plugin folder).
  3. Install a font containing an svg font file, or install a font bundle - such as the one provided here: https://github.com/keremciu/font-bundles

=======

- Documentation

Its a little documentation about commands
Command Description
Install a Font-Bundle Install a newly downloaded font bundle.
Export your Font-Bundle Export or backup all of your icon fonts previously installed. Recommended to use before you install new version of the plugin.
Install a Font Install a newly downloaded font - containing an svg font file.
Remove a Font Remove a previously installed font.
Grid Insert Insert an icon by searching for it in a visual grid table.
Name Insert Insert an icon by name.
HTML of Selected Icon To use an icon on web or mobile, select it and use this command.

- Minimum Dependencies

  • OSX El Capitan & Yosemite (#44)
  • Sketch 3.4.4.

You can follow me on twitter to get updates. http://twitter.com/keremciu

License

MIT

=======

Donate

🍻

If you want you can buy me a beer: https://www.paypal.me/keremsevencan :)

Old version

You can see an old version of this plugin here: http://i.imgur.com/EBGmlSe.gif - and you can download it from here: https://github.com/keremciu/sketch-iconfont/tree/oldversion