https://github.com/sublee/sublette
Color schemes by Heungsub Lee
https://github.com/sublee/sublette
color-scheme
Last synced: 6 months ago
JSON representation
Color schemes by Heungsub Lee
- Host: GitHub
- URL: https://github.com/sublee/sublette
- Owner: sublee
- License: mit
- Created: 2019-06-12T17:06:46.000Z (about 7 years ago)
- Default Branch: master
- Last Pushed: 2023-03-20T21:29:17.000Z (over 3 years ago)
- Last Synced: 2025-09-26T04:47:31.039Z (9 months ago)
- Topics: color-scheme
- Language: Python
- Homepage:
- Size: 1.95 MB
- Stars: 42
- Watchers: 2
- Forks: 2
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Sublette
[](https://github.com/sublee/sublette)
[](https://travis-ci.org/sublee/sublette)
I've always loved coloring. Now it's time to design my color schemes.
## Tool Configurations
- [Hyper](configs/Hyper)
- [PuTTY](configs/PuTTY)
- [iTerm2](configs/iTerm2)
- [PyCharm or IntelliJ IDEA](configs/IntelliJ)
- [Slack](configs/Slack)
- [Visual Studio Code](https://github.com/minmul117/vscode-sublette) by [Park GiSung](https://github.com/minmul117)
- [Windows Terminal](https://windowsterminalthemes.dev/?theme=Sublette)
## For Terminal (base)
Color | Hex | RGB | HSL |🎨
-------------- | --------- | -------------------- | --------------------- | --------------------------
Foreground | `#ccced0` | `rgb(204, 206, 208)` | `hsl(210, 2%, 82%)` | 
Background | `#202535` | `rgb(32, 37, 53)` | `hsl(226, 40%, 21%)` | 
Black | `#253045` | `rgb(37, 48, 69)` | `hsl(219, 46%, 27%)` | 
Red | `#e57` | `rgb(238, 85, 119)` | `hsl(347, 64%, 93%)` | 
Green | `#5e7` | `rgb(85, 238, 119)` | `hsl(133, 64%, 93%)` | 
Yellow | `#fd8` | `rgb(255, 221, 136)` | `hsl(43, 47%, 100%)` | 
Blue | `#58f` | `rgb(85, 136, 255)` | `hsl(222, 67%, 100%)` | 
Magenta | `#f7c` | `rgb(255, 119, 204)` | `hsl(322, 53%, 100%)` | 
Cyan | `#4ee` | `rgb(68, 238, 238)` | `hsl(180, 71%, 93%)` | 
White | `#f5f5da` | `rgb(245, 245, 218)` | `hsl(60, 11%, 96%)` | 
Bright Black | `#405570` | `rgb(64, 85, 112)` | `hsl(214, 43%, 44%)` | 
Bright Red | `#e65` | `rgb(238, 102, 85)` | `hsl(7, 64%, 93%)` | 
Bright Green | `#9e7` | `rgb(153, 238, 119)` | `hsl(103, 50%, 93%)` | 
Bright Yellow | `#ff7` | `rgb(255, 255, 119)` | `hsl(60, 53%, 100%)` | 
Bright Blue | `#7bf` | `rgb(119, 187, 255)` | `hsl(210, 53%, 100%)` | 
Bright Magenta | `#a8f` | `rgb(170, 136, 255)` | `hsl(257, 47%, 100%)` | 
Bright Cyan | `#5fb` | `rgb(85, 255, 187)` | `hsl(156, 67%, 100%)` | 
Bright White | `#ffe` | `rgb(255, 255, 238)` | `hsl(60, 7%, 100%)` | 
Use "Foreground" and "Background" for the cursor and cursor text respectively.
### Showcase
## For IDEs
Usually, IDEs have configurations of highlight colors to indicate hints. The
highlight colors should be dimmer than the text colors. Here I define dim
colors for the use.
Color | Hex | RGB | HSL |🎨
----------- | --------- | -------------------- | --------------------- | -------------------
Dim | `#96a0aa` | `rgb(150, 160, 170)` | `hsl(210, 12%, 67%)` | 
Dimmer | `#678` | `rgb(102, 119, 136)` | `hsl(210, 14%, 46%)` | 
Dim Red | `#534` | `rgb(85, 51, 68)` | `hsl(330, 40%, 33%)` | 
Dim Green | `#454` | `rgb(68, 85, 68)` | `hsl(120, 20%, 33%)` | 
Dim Yellow | `#555045` | `rgb(85, 80, 69)` | `hsl(41, 19%, 33%)` | 
Dim Blue | `#347` | `rgb(51, 68, 119)` | `hsl(225, 57%, 47%)` | 
Dim Magenta | `#546` | `rgb(85, 68, 102)` | `hsl(270, 33%, 40%)` | 
Dim Cyan | `#356` | `rgb(51, 85, 102)` | `hsl(200, 50%, 40%)` | 
## For Slides
The purpose of a color scheme for Terminal and Slides is different. I need only
4 grayscale colors for text and background, and 6 hues--Blue, Red, Green,
Yellow, Violet, Teal--for clear semantics.
I prefer Black as the background color on projection screens to erase the
bezel. Also, I prefer White as the text color for the best readability.
The brightness of 6 hues should be normalized to be recognized at the same
level. If they are not, some hues look like more important than other hues. By
the way, some colors in the terminal color scheme are slightly brighter than
other colors. Here I adjust them for brightness normalization.
Color | Hex | RGB | HSL |🎨
------------------- | --------- | -------------------- | --------------------- | ---------------------------------
Slides Foreground | `#fff` | `rgb(255, 255, 255)` | `hsl(0, 0%, 100%)` | 
Slides Foreground 2 | `#808080` | `rgb(128, 128, 128)` | `hsl(0, 0%, 50%)` | 
Slides Foreground 3 | `#404040` | `rgb(64, 64, 64)` | `hsl(0, 0%, 25%)` | 
Slides Background | `#000` | `rgb(0, 0, 0)` | `hsl(0, 0%, 0%)` | 
Slides Blue | `#58f` | `rgb(85, 136, 255)` | `hsl(222, 67%, 100%)` | 
Slides Red | `#e57` | `rgb(238, 85, 119)` | `hsl(347, 64%, 93%)` | 
Slides Green | `#5d7` | `rgb(85, 221, 119)` | `hsl(135, 62%, 87%)` | 
Slides Yellow | `#fc7` | `rgb(255, 204, 119)` | `hsl(37, 53%, 100%)` | 
Slides Violet | `#a8f` | `rgb(170, 136, 255)` | `hsl(257, 47%, 100%)` | 
Slides Teal | `#4dd` | `rgb(68, 221, 221)` | `hsl(180, 69%, 87%)` | 
Use "Slides Foreground" for the link but with underline.
### Showcase
## Grayscale
Color | Hex | RGB | HSL |🎨
------------ | --------- | -------------------- | --------------------- | ---------------------------------
Bright White | `#ffe` | `rgb(255, 255, 238)` | `hsl(60, 7%, 100%)` | 
White | `#f5f5da` | `rgb(245, 245, 218)` | `hsl(60, 11%, 96%)` | 
Foreground | `#ccced0` | `rgb(204, 206, 208)` | `hsl(210, 2%, 82%)` | 
Dim | `#96a0aa` | `rgb(150, 160, 170)` | `hsl(210, 12%, 67%)` | 
Dimmer | `#678` | `rgb(102, 119, 136)` | `hsl(210, 14%, 46%)` | 
Bright Black | `#405570` | `rgb(64, 85, 112)` | `hsl(214, 43%, 44%)` | 
Black | `#253045` | `rgb(37, 48, 69)` | `hsl(219, 46%, 27%)` | 