https://github.com/n8rzz/ss-octopus
A simple Dark theme for VSCode with a muted color palette and smart code highlighting
https://github.com/n8rzz/ss-octopus
dark-theme visual-studio-code vscode vscode-theme
Last synced: 24 days ago
JSON representation
A simple Dark theme for VSCode with a muted color palette and smart code highlighting
- Host: GitHub
- URL: https://github.com/n8rzz/ss-octopus
- Owner: n8rzz
- License: mit
- Created: 2018-07-21T02:46:40.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2020-03-15T05:13:00.000Z (about 5 years ago)
- Last Synced: 2025-02-06T11:40:22.809Z (3 months ago)
- Topics: dark-theme, visual-studio-code, vscode, vscode-theme
- Language: JavaScript
- Homepage: https://marketplace.visualstudio.com/items?itemName=n8rzz.ss-octopus
- Size: 3.23 MB
- Stars: 2
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# SS-Octopus Theme
A Dark theme for [Visual Studio Code](http://code.visualstudio.com/).
## Color Palette
## Supports
* Typescript
* ES2015+
* Node
* HTML
* SCSS
* CSS
* JSON
* Dockerfile
* Ruby
* Go
* Nginx
* yml
_SS-Octopus was written by me, for me. As such, I don't expect this theme to work for everybody or, perhaps, anybody._
## Examples
### Javascript
#### Angular
#### Typescript
#### ES2015+
#### Node
### SCSS
### Ruby
### Go
### JSON
### YML
## Installation
1) Go to Extensions
1) Search for ss-octopus
1) Install
1) Restart Visual Studio Code (or click Reload window)
1) Go to Preferences → Color Theme and choose SS-Octopus
**Enjoy!**
---
## User Settings
As of March 2020, some settings within VSCode are starting to conflict with the colors provided by this theme:
### Incorrect Color
### Correct Color
Good news, there is a simple fix! In order to get back to the correct colors, a new setting must be added to your `settings.json` file:
```json
"editor.semanticHighlighting.enabled": false
```
## Selection Styles
Coloring a selection in VSCode is tricky. I've done my best to make the selection styles work with the theme, however, it's not perfect. If you wish to make some tweaks of your own, feel free to modify the following `workbench.colorCustomizations` within your `settings.json` file.
```json
"workbench.colorCustomizations": {
"editor.findMatchBackground": "#ffffff01",
"editor.findMatchBorder": "#9735c566",
"editor.findMatchHighlightBackground": "#4e315355",
"editor.findMatchHighlightBorder": "#f700ff22",
"editor.selectionBackground": "#0b5827aa",
"editor.selectionHighlightBackground": "#0b582777",
"editor.selectionHighlightBorder": "#5aca7699",
"editor.wordHighlightBackground": "#00ffff11",
"editor.wordHighlightBorder": "#5aca7699",
"editor.wordHighlightStrongBackground": "#00ffff40",
"editor.wordHighlightStrongBorder": "#5aca7699"
}
```
## The Squishy Parts
### Motivation
I wanted to make a theme that satisfied some of the pain points I've run into with existing themes. The goals for SS-Octopus are:
* Support the languages I frequently work with
* Highlight mostly the important parts of the code
* Allow for easy updating by organizing theme by color, not by scope
### Why ss-octopus
Two (bad) reasons:
1) For some reason I like to name some of my projects as if they were ships, prefixed with `ss` and named after some creature of the sea
1) I previously wrote an unpublished theme for the [Atom](https://atom.io/) editor that had the same name
Essentially, *SS-Octopus* is a nonsensical name that makes me giggle softly when I see it because I know it doesn't mean anything.
### Inspirations
* This whole adventure started after I read the `Motivation` section of the [Alabaster Theme](https://github.com/tonsky/vscode-theme-alabaster) readme.
* Example files from [Night Owl](https://github.com/sdras/night-owl-vscode-theme)
* `angular.component.ts`
* `react.js`
* `ruby.rb`
* `yml.yml`
## License
[MIT License](LICENSE)