How to make your own custom Ableton Live 10 Theme/Skin

Customizing things is cool and it makes alot of fun. In this article you will learn how to customize your Ableton Live 10. 



How to make your own Ableton Live 10 Theme/Skin

How Is It Possible To Make Your Own Themes?


In the program folder of Ableton is a folder named "Themes". Therein are files with the ending [.ask]. These files can be opened in a text editor like Notepad++. They contain the following data.


Parameter List

Each parameter represents a UI (user interface) element of Ableton. Within that parameter you see color values in the format RGB (Red, Green, Blue, Alpha: Transparency). The color of each UI element is defined by adjusting these values.

How To Make Your Own Theme - Step by Step.


First Step

Open one of the Default Themes included in the [.zip] file. It is possible to use Ableton Standard Themes. (Important: They are not optimized for the use with the parameter list.)


Second Step

Right Klick on one of the Default Themes (Default Dark, Default Light, Default Live 9, Default Mid Dark, Default Mid Light).


Third Step

Open with your Text Editor (for instance Notepad++ or Visual Studio Code).


Info: If you choose to design a dark theme then select either the Default Dark or Default Mid Dark theme. To design a light theme select one of the Default Light themes.


Fourth Step

Now you can start changing the RGB values of each parameter. (The Alpha Value determines the transparency of the chosen color).



Save the adjusted [.ask] file to the Ableton "Themes" folder (default location for Windows: C:\Program\Ableton\Resources\Themes).

Notice: Before you save it change the data type to “All Types”. 



Now open the theme in Ableton Live 10. For that open the preferences window  in Ableton Live 10 (you will find it under “Options” in the title bar. In the preferences window find the entry “Look Feel”. Select your newly created theme in the “Color Scheme” drop-down menu.



Practical Design Tips


Tip 1:

To find out the specific RGB values of a color use a designtool like Adobe Illustrator or the color picker provided by Google (type in "color picker" in Googles search bar).


Googles Color Picker Tool

Tip 2:


For true grey colors, all three RGB-Variables should have the exact same value. (e.g. 54, 54,54) If that is not the case, you have to match the ratio of deviation in all your grey colors. (e.g. 54, 54, 58 <-> 24, 24, 28). Otherwise the color combination may look off.