All Projects → eBay → SketchSVG

eBay / SketchSVG

Licence: other
Have icons in a Sketch file but don't want to manually extract and compress them as SVGs? Let our SketchSVG tool do it!

Programming Languages

javascript
184084 projects - #8 most used programming language
HTML
75241 projects

Projects that are alternatives of or similar to SketchSVG

phosphor-figma
A flexible icon family for Figma
Stars: ✭ 17 (-26.09%)
Mutual labels:  icons, svg-icons, svgs
Feathericon
simply generic vector icon collection - including sketch file, svg files, and font files.
Stars: ✭ 178 (+673.91%)
Mutual labels:  sketch, icons, svg-icons
Alfred Font Awesome Workflow
🎩 Font Awesome workflow for Alfred
Stars: ✭ 714 (+3004.35%)
Mutual labels:  sketch, icons, svg-icons
Browser Logos
🗂 High resolution web browser logos
Stars: ✭ 5,538 (+23978.26%)
Mutual labels:  icons, svg-icons, svgs
kironroy.github.io
Portfolio
Stars: ✭ 14 (-39.13%)
Mutual labels:  sketch, svg-icons
Material-icons-sketch-library-with-color-overrides
This is a collection of all material icons from Google. The Sketch file contains icons as symbols with color overrides, so you can easily change their colors. Black and white colors are available by default, but you can add your own ones on the Colors page. All icons are set to exportable directly on the symbols page, so they will be exportable …
Stars: ✭ 13 (-43.48%)
Mutual labels:  sketch, icons
Google Material Icons For Sketch
Google Material Icons Library for Sketch App
Stars: ✭ 420 (+1726.09%)
Mutual labels:  sketch, icons
Coolicons
Carefully designed icons for your next project. Perfect for use in web and mobile. Support for SVG, your favourite design tool and webfont. Completely free and open source.
Stars: ✭ 81 (+252.17%)
Mutual labels:  sketch, icons
React Kawaii
Cute SVG React Components
Stars: ✭ 2,709 (+11678.26%)
Mutual labels:  icons, svg-icons
Makeiconswithsketch
Simple tutorials about how to make icons with Sketch.
Stars: ✭ 643 (+2695.65%)
Mutual labels:  sketch, svg-icons
svelte-simple-icons
📦 This package provides the Simple Icons packaged as a set of Svelte components.
Stars: ✭ 27 (+17.39%)
Mutual labels:  icons, svg-icons
Apple-App-Icons
This repository is for hosting Apple App Icons Sketch file, .sketch
Stars: ✭ 31 (+34.78%)
Mutual labels:  sketch, icons
Font Awesome
The iconic SVG, font, and CSS toolkit
Stars: ✭ 66,937 (+290930.43%)
Mutual labels:  icons, svg-icons
Ltfinderbuttons
My Finder buttons collection for macOS.
Stars: ✭ 269 (+1069.57%)
Mutual labels:  sketch, icons
Vectorlogozone
3,000+ gorgeous SVG logos, perfect for your README or credits page
Stars: ✭ 239 (+939.13%)
Mutual labels:  icons, svg-icons
Icondrop
Get access to 2 million+ design resources right inside Adobe Xd, Figma, Sketch, Microsoft Office, G Suite and many more.
Stars: ✭ 174 (+656.52%)
Mutual labels:  sketch, icons
Sketch Feather
Sketch library for Feather icons
Stars: ✭ 237 (+930.43%)
Mutual labels:  sketch, icons
favicon
🖼 An attempt to capture all possible favicons for a web project.
Stars: ✭ 17 (-26.09%)
Mutual labels:  sketch, icons
Vue Eva Icons
Is a pack of more than 480 beautiful open source Eva icons as Vue components
Stars: ✭ 189 (+721.74%)
Mutual labels:  icons, svg-icons
Small N Flat
svg icons on a 24px grid
Stars: ✭ 205 (+791.3%)
Mutual labels:  icons, svg-icons

SketchSVG

What is it?

SketchSVG is a CLI that is intended to convert icons made in Sketch to compressed, easy to use SVGs for use on the web. SketchSVG also will convert these to a Base64 encoded value so they can be used in conjunction with the CSS url property.

Installation

Important: It should be noted that this is for Mac only, since Sketch is only on Mac OS npm install sketchsvg -g
or if you prefer yarn yarn global add sketchsvg

Usage

Once installed, run sketchsvg like so:

sketchsvg /full/path/to/file

From there, SketchSVG will convert your icons to SVGs as well as Base64s and output them like so:

alt text

SketchSVG will also generate a basic HTML page with a bare bones editor for you to test out your icons, change the colors, sizes, etc. Here is a screenshot of this:

alt text

Demo

We have included a couple of test files for single as well as multiple icons in a single sketch file. To try it out download our sample files in the /sample folder.

First install sketchsvg and grab our .sketch files from the repo. Then:

sketchsvg /path/to/multitest.sketch

Contributing

Interested in contributing? That's awesome! Please check out our Contributing Guidelines.

Questions/Comments

Feel free to reach out to patrickcanella AT gmail DOT com for any questions or comments regarding this tool. Feel free to open an Issue or a Pull Request as you see fit. Thanks!

License

Copyright 2019 eBay Inc.
Developer: Patrick Canella

Use of this source code is governed by an MIT-style license that can be found in the LICENSE file or at https://opensource.org/licenses/MIT.

3rd Party Code

Sketch is a third party tool, not provided with this code, and will need to be licensed separately. For details, see: https://www.sketch.com/

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].