Finally after much hard work the last couple of months we are very proud to announce the release of the brand new Sketch2React 2020 😺 🙌 That also marks the release of our own marketplace, something that we have only dreamt about in the past. Owning the whole chain of software 👉 customer gives us room to grow, try things, experiment and most importantly, have one channel for delivery of all our apps, templates and other goodies.

New in Sketch2React 2020 🎁


In this tutorial I’m going to explore the scenario where you have built something in Sketch with Sketch2React and used our Capacitor 3.0 export for creating iOS projects. In itself really amazing, but you feel you could do more. Always push for more as a designer, right? This is going to be fun!

Requirements ✅

This tutorial presumes a few things:

  1. That you know how to build in Sketch for Sketch2React
  2. That you have Sketch2React 2021
  3. That you have done the prequel tutorial and installed all the nice things you need in this one

Download the Sketch file 💎


One of the most rewarding aspects of running a small, independent software company together with a great friend is that you have so much trust in each other, that more than often things move forward without discussion. We read between the lines.

Take our latest update for Stratos Tokens 2021. We had a plan of course. Then that plan changed, got supercharged and out came this monster of an update without us even realizing it. We sat there in amazement. What have we done?

That is what great product development should always be about, an endless delight in doing better…


We in Team Sketch2React believe in empowering designers with choice, so you will always have the ability to choose for yourself. Basically, it comes down to answering these questions:

  • Do you design for cross-platform products? (iOS, Android, Web, macOS, Windows)
  • Do you use something like Material UI for React? (Web)
  • Do you just want to output raw design tokens (JSON) and let your awesome developers do all the implementation?
  • Do you want to use theming? (JSON)

Thing is, we support all these different scenarios, and they require a different amount of setup and understanding. Let’s take the analogy of game…


A hands-on practical guide on how to get started working with design tokens and Stratos Tokens — the designer’s perspective

In this tutorial we’re going to do something different, we’re going to divided this practical guide into two articles:

  • The designer’s perspective (this one)
  • The developer’s perspective (Fredriks upcoming tutorial)

I’ll be creating the design tokens needed to control the styling that we use in both Sketch2React and Stratos Tokens apps straight from within Sketch. Then later, in part two, Fredrik is going to use these design tokens (autogenerated SCSS from Stratos Tokens) and implement them in code. Fun!

Follow the project

If you’re interested in following our process of building a minimal design system make sure to follow our project on Github…


We have created many tutorials since the very beginning of Team Sketch2React, both written and recorded. Why? Because it’s fun to teach and after a while it becomes a nice giving habit.

I have changed the way I do them, though. The written ones take longer to create, but they have a great benefit, you set the pace, and you don’t need to press the pause button all the time to understand what’s going on 😺

The setup becomes

  • Step by step thorough written tutorials, often quite long
  • Short brief companion video tutorial that shows what’s been told

We think this formula is…


There’s a good reason we in Team Sketch2React love Sketch assistants. It has reduced our time doing really basic support for Sketch2React to a bare minimum. Which is wonderful, that way we can put that time instead on making our apps even better.

Don’t get us wrong, we love supporting our products, and we’ll keep doing that as long as people use our apps and ask us questions. We just don’t want our customers to get stuck on the basic steps for getting everything up and running.


Hey guys! We just released updates worth mentioning in a blog post like this for both Sketch2React and Stratos Tokens. So, here we go!

Sketch2React — Export to iOS & Android


This is the way…

In this tutorial you will learn:

  • What Style Dictionary is
  • How to structure things in Sketch or Figma for it to work its magic of translation via Stratos Tokens and out to iOS, Android and SCSS
  • How to install Style Dictionary into your Stratos Tokens project folder
  • How to run and update your design tokens

If you’re just sitting there with a big❓read this article first 👇

Tutorial requirements


Remember when version tracking was perplexing to us designers? Then came Abstract, Plant, and other great apps & services that solved that issue in a way that mere normal humans without engineering degrees would actually understand how it worked. Hang on to this reasoning.

Understanding how design tokens work, how you can create them and how they will transform and impact your teams workflow is the next big thing as we in Team Sketch2React see it.

Today we’re very proud to launch the brand new, totally reworked Stratos Tokens 2021 to the world. After more than one year in development…

Juan Maguid

Co-founder of Team Sketch2React. Designer that wants to make your maker lives easier😺👍

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store