Skip to content
Color schemes by Heungsub Lee
Branch: master
Clone or download
Latest commit 46c7050 Jun 30, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
configs Generate assets in Travis CI [ci skip] Jun 20, 2019
factory
plates
showcase
.travis.yml
LICENSE Initial commit Jun 12, 2019
README.md

README.md

Sublette

Sublette Build Status

I've always loved coloring. Now it's time to design my color schemes.

Tool Configurations

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%)
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

You can’t perform that action at this time.