Skip to content
master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
src
 
 
 
 
 
 
 
 
 
 

⛔️ DEPRECATED

This project was written for theme solution in older versions of sketch. Color variables feature came up with sketch 69. With Sketch 69, color variables feature came along and this plugin can be improved with this feature. But in this process, I transferred all my projects to Figma, which I think is more useful in the design systems. So, I'm no longer develop or improvoment in this project.

icons

Sketch Dark Side Plugin

  • Easily design light and dark themes in Sketch.
  • Switch between themes.
  • Export color assets for Xcode and Android Studio.

Example App

Installation

  • Download the latest release of the plugin
  • Un-zip
  • Double-click on darkside.sketchplugin

Usage

Unfortunately Sketch doesn't have the color override feature. In order to use the plugin, we need to give the colors used in the design with layer styles.

You can download the sample design file prepared with the method described below.

Step 1: Create your color palette with layer styles

In order to easily make changes on the colors, you can prepare a page where all colors are defined.

You should name the layer styles of these colors as:

Themes/<Light or Dark>/<Your color name>

Plugin will be based on shared styles that start only with Themes, followed by Light or Dark when switching and exporting colors.

Giving a shared style name

Step 2: Assign shared styles to layers

You should make sure that all the color of layers and texts in the document come from the shared styles you define.

Assign shared styles to layers

Coloring the text layers with shared styles a little bit tricky. You can read this article for detailed explanation.

Assign shared styles to text layers

Step 3: Switch Theme

Your design is ready! You can switch between Light and Dark themes by pressing Switch theme from plugins menu.

Testing your design

Step 4: Export your color assets for developers

You can export the theme from the plugin menu for developers. They can use the exported files in Xcode or Android Studio and they do not spend extra effort to adapt your applications to the system theme.

About

🎨Easily design light and dark themes in Sketch. Switch between themes. Export color assets for Xcode and Android Studio.

Resources

Stars

Watchers

Forks

Packages

No packages published