Sketch2React is a free Design to Code Playground that consists of:
A free framework based on Bootstrap 4 that consists of Componentsβ
A Desktop App (Mac only) that converts your Sketch files into actual code
A Sketch plugin that helps you setting up the Bootstrap Grid inside of Sketch
From our Code App you can export to HTML5 totally for free
A Pro paid version is coming where you will also have things like true React export & Live HTML Previewing.
Our framework is really great for many things, like for example:
Learning limitations of code, trying out things in a real code environment
We call it the Design to Code Playground because once you get the grips you will have lots and lots of fun!
Static websites like for example portfolios, landing pages, product pages
Fully responsive prototypes that actually are for real
All things that require complex logic that we don't yet support. On the other hand, designers can set up things like the grid, colors, fonts, general layout rules and with that developers can do anything. Sky is the limit!
Nope! Everything is handled locally on your computer, nothing gets uploaded to our servers. Super safe. We promise.
You actually donβt need the plugin but it will make your workflow so much faster. It works a bit like a wizard that helps you with all of the really tedious stuff like creating containers, choosing margin and paddings etc. All of these settings can be changed afterwards in Sketchs layer panel.
Yes you can! Actually itβs really easy, check out our handy Cheat Sheet for further instructions.
You use our Code App for that. Read more here about exporting.
Framework, code app, layout plugin and HTML5 export will forever be free. We're working on Pro features like React export and other goodies that will require a subscription, but that's not yet available.
It's really stable. We call it Beta because we have not reached our goal yet. Not because it's flawed or super buggy. You can read an article here if youβre interested.
β