Couldn't find a theme I really dig, so I tried to make my own theme based on all the things/elements I like from wonderful themes I've used before. :)
Current font settings in screenshots: Font face: Inconsolata | Font size: 22*
Screenshots below are based on the default starting point of all Agila Themes.
You can customize the UI to your liking (e.g camouflage workspace with the color scheme background, sidebar, tab, autocomplete, and scrollbar setup/color preferences) by referring to the "Settings" section of this documentation. Enjoy! :)
via Package Control, where Agila is listed as Agila Theme
.
- Open Command Palette using menu item
Tools -> Command Palette...
- Choose
Package Control: Install Package
- Find
Agila Theme
and hitEnter
via installing the theme manually.
- Download the latest release .zip
- Unzip and rename folder to
Agila Theme
. - Move
Agila Theme
folder inside the Packages directory (Preferences > Browse packages...
)
via User Preferences file (Sublime Text -> Preferences -> Settings - User
). After setting up,
don't forget to restart Sublime Text Editor for changes to take effect.
"theme": "Agila.sublime-theme",
"color_scheme": "Packages/Agila Theme/Agila Oceanic Next.tmTheme",
"theme": "Agila Origin.sublime-theme",
"color_scheme": "Packages/Agila Theme/Agila Origin Oceanic Next.tmTheme",
"theme": "Agila Dracula.sublime-theme",
"color_scheme": "Packages/Agila Theme/Agila Dracula.tmTheme",
"theme": "Agila Monokai.sublime-theme",
"color_scheme": "Packages/Agila Theme/Agila Monokai Extended.tmTheme",
"theme": "Agila Classic.sublime-theme",
"color_scheme": "Packages/Agila Theme/Agila Classic Oceanic Next.tmTheme",
"theme": "Agila Light.sublime-theme",
"color_scheme": "Packages/Agila Theme/Agila Light Solarized.tmTheme",
Note: You can use active guide with these schemes by adding:
"indent_guide_options":
[
"draw_normal",
"draw_active"
],
I've made some UI parts customizable e.g icon colors, sidebar items, etc.. :)
overrides default theme sidebar, scrollbars and tab background based on theme scheme background
"theme_agila_camouflage": true,
overrides default theme sidebar and tab background only based on theme scheme background
"theme_agila_camouflage_semi": true,
"theme_agila_sidebar_small": true,
"theme_agila_sidebar_medium": true,
"theme_agila_sidebar_large": true,
"theme_agila_sidebar_heading_white": true,
"theme_agila_sidebar_heading_gray": true,
"theme_agila_sidebar_heading_lightblue": true,
"theme_agila_sidebar_heading_yellow": true,
"theme_agila_sidebar_heading_pink": true,
"theme_agila_sidebar_font_xsmall": true, //font-size: 11
"theme_agila_sidebar_font_small": true, //font-size: 12
"theme_agila_sidebar_font_big": true, //font-size: 14
"theme_agila_sidebar_selected_entry_white": true,
"theme_agila_sidebar_selected_entry_gray": true,
"theme_agila_sidebar_selected_entry_lightblue": true,
"theme_agila_sidebar_selected_entry_yellow": true,
"theme_agila_sidebar_selected_entry_pink": true,
"theme_agila_sidebar_light_icons": true,
"theme_agila_compact_sidebar": true,
"theme_agila_compact_tab": true,
"theme_agila_modified_tab_marker_white": true,
"theme_agila_modified_tab_marker_gray": true,
"theme_agila_modified_tab_marker_lightblue": true,
"theme_agila_modified_tab_marker_yellow": true,
"theme_agila_modified_tab_marker_pink": true,
"theme_agila_auto_complete_white": true,
"theme_agila_auto_complete_gray": true,
"theme_agila_auto_complete_lightblue": true,
"theme_agila_auto_complete_yellow": true,
"theme_agila_auto_complete_pink": true,
"theme_agila_vertical_scrollbar_white": true,
"theme_agila_horizontal_scrollbar_white": true,
"theme_agila_vertical_scrollbar_gray": true,
"theme_agila_horizontal_scrollbar_gray": true,
"theme_agila_vertical_scrollbar_lightblue": true,
"theme_agila_horizontal_scrollbar_lightblue": true,
"theme_agila_vertical_scrollbar_yellow": true,
"theme_agila_horizontal_scrollbar_yellow": true,
"theme_agila_vertical_scrollbar_pink": true,
"theme_agila_horizontal_scrollbar_pink": true,
"theme_agila_vertical_scrollbar_thickest": true, //width: 6
"theme_agila_horizontal_scrollbar_thickest": true,
"theme_agila_vertical_scrollbar_thicker": true, //width: 5
"theme_agila_horizontal_scrollbar_thicker": true,
"theme_agila_vertical_scrollbar_thinner": true, //width: 3
"theme_agila_horizontal_scrollbar_thinner": true,
"theme_agila_vertical_scrollbar_thinnest": true, //width: 2
"theme_agila_horizontal_scrollbar_thinnest": true,
"theme_agila_vertical_scrollbar_invisible": true, //width: 0
"theme_agila_horizontal_scrollbar_invisible": true,
- Preap Theme - UI inspiration and .sublime-theme source code :)
- Spacegray Theme - UI inspiration and .sublime-theme source code :)
- amCoder Theme - UI inspiration and .sublime-theme source code :)
- Neka Theme - Icons
- Oceanic Next Color Scheme - where Default and Classic theme color scheme are based
- Solarized Color Scheme - where Light theme color scheme is based
- Dracula Color Scheme - where Dracula theme color scheme is based
- Monokai Extended Color Scheme - where Monokai theme color scheme is based
- Colorhexa - color combinations
meteor create --sample todos
- screenshot code snippet :p- Contributor(s): davidmatas
Have a color combination in mind or perhaps you also want to try and create your own? Check the Agila.sublime-theme
source code... I made it super easy for anyone to customize a sublime UI theme through my extensive comments. :p Enjoy! :)