Skip to content
Generate a static site (ya know, like github pages) from a Sketch file
JavaScript HTML CSS
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
app
gulpfile.js
screens
sketch
sketchtool
.drone.sec
.drone.yml
.gitignore
README.md
cli.js
main.js
package.json

README.md

Node Version NPM Version NPM License

Build Status dependencies Status Code Climate downloads monthly

alt text

Sketch UI Generator

Live GitHub Pages Demo

Generates a Interactable HTML website with your Sketch file.

Generated in Browser:

alt text

Actual Sketch App

alt text

Sketch file credits: Sketch File

Requirements:

To Get Started:

Install the package:

npm install sketch-preview -g

Now you have a cli tool available, to use it:

sketch-preview --input=mysketchfile.sketch --open

The --open at the end tells sketch-preview to open a browser tab to view your generated site. Otherwise it will simply build the static site in the public directory.

Including in your Gulp

You can also include this library in your gulp process, firstly make sure you install the package:

npm install sketch-preview --save

Then inside of your gulpfile.js:

// You must pass in your gulp variable for us to extend:
const preview = require('sketch-preview')({
	input: './sketch/TST.sketch',
}, gulp)

// Generate sketch preview files:
gulp.task('export', preview)

Running Dev:

Inside the directory run:

gulp

Be sure to run npm update to ensure all the NPM dependencies are up to date.

License

MIT License

You can’t perform that action at this time.