Import a TextMate Theme

TextMate themes have become somewhat of a standard when it comes to defining syntax color themes. These .tmTheme files are supported by many other editors such. Cloud9 offers an importer that converts these files into css that can be used in Cloud9. This guide walks you through importing a .tmTheme file into Cloud9.

Existing themes can be found in the SDK under the ace/theme directory.

Importing

To import a file run the included tmtheme.js tool in the tools directory.

$ cd core # the directory where you cloned the SDK
$ cd node_modules/ace/tool
$ npm install; cd ..
$ node ./tool/tmtheme.js mytheme path/to/MyTheme.tmTheme /path/to/plugin/themes

This creates two files in the /path/to/plugin/themes directory.

  • mytheme.js Some metadata for your theme.
  • mytheme.css The css that contains the theme styling.

Header

Open mytheme.css and add the following line as it's first line.

/* name: <Name>; isDark: <true|false>; cssClass: <cssClass>; */

Copy the values of the variables name, isDark and cssClass from mytheme.js to this header. Save the .css file and delete the .js file.

Your theme is now ready for distribution. See the guide on adding themes in Cloud9 Bundles for more information.