Putumayo is a a rainforest-inspired color theme for CLI-oriented software developers.

Features

• 🌓 Dark theme (light theme will be created in the future).
• 🎨 Meticulously crafted and balanced selection of colors.
• 📺 Focused on CLI products to give a pleasant experience for terminal users.
• 👥 AA accessibility in most cases.
• 🌳 Inspired by nature.

Table of contents

• Features
• Table of Contents
• Variants
• Accessibility
• Concept
• Methodology
• Palette

Variants

Currently Putumayo has only a dark variant, but I'm expecting to develop a bright variant in the future.

The name of the dark variant is Putumayo Midnight, while the bright variant is referred to as Putumayo Sunlight.

Accessibility

Most of the foreground colors meet the WCAG 2.0 AA Conformance Level of color contrast when tested against the base background color bg10. The only ones that fail this criteria are steel and nightfog for the Putumayo Midnight variant, which are mostly recommended for low-contrast UI elements like disabled text, code comments, and line numbers.

Concept

In the jungle you find yourself surrounded by millions of leaves displaying a multitude of green shades, from yellowish to bluish to brownish. The soil and the trunks exhibit an abundance of browns and greys. These colors give you a sense of serenity and recharge. But if you keep a watchful eye around, you'll start finding little treasures of color: a magnificent deep blue butterfly appears from nowhere; a little bright yellow frog stands still in a leave; a beautiful purple orchid hangs from a branch; a bunch of noisy red guacamayas fly from one tree to another.

That was the feeling I had when I visited the Putumayo rainforest in Colombia. Some weeks later, when I returned to work, I wondered if it was possible to somehow recall that sensation in my day to day use of the terminal. And that's how the Putumayo project was born. I decided to create a theme that balanced the muted main colors of the rainforest, with the vibrant ocasional colors of the exuberant little creatures that inhabit it.

In practice, this means that frequent/large elements in the UI or code should use various shades of green and brown —emulating the leaves, trunks, and soil—, while occasional/small elements should use shades of blue, magenta, red, orange, and yellow —emulating the flowers, butterflies, birds, and amphibians living inside—.

The result is a beautiful and pleasant color scheme that mixes both the calming tones and prismatic diversity of the rainforests of our planet.

Methodology

The color palette was meticulously crafted to expose a balanced collection of swatches along with a simple but effective usage pattern for them. This configuration avoids visual fatigue during long coding sessions, while asisting focus.

This was achieved by observing the following principles:

• Background colors should admit a reasonable contrast between them and the main foreground color to ensure a clear readability while preventing long term visual exhaustion.

• Foreground colors should represent all main sections of the color wheel, with additional variations, to allow for an heterogeneous but cohesive arrangement.

• All colors in the palette should be defined using precise values of hue, saturation and lightness to obtain a harmonic set of easily distinguishable swatches.

• There should be a design guide to ensure that frequent/large elements are styled using calming/muted tones, while occasional/small elements are styled with distinctive/saturated ones, to aim for a unique balance between sobriety and enthusiasm.

Palette

Midnight	Sunlight
Amethyst O/S #C689E6 rgb(198,137,230) hsl(279,65%,72%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Terminal magenta. Hint texts and markers. Code: All keywords like if, else, for, while, import, export, return, try, catch, or, and, in, of, from, etc., except procedure-related and storage-related ones (see denim/unknown swatch).
Cherry O/S #E67D7D rgb(230,125,125) hsl(0,68%,70%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Terminal red. Error texts and markers. Select/visual mode indicators in modal editors. Diff deletion indicators. Code: Markdown bold texts.
Amber O/S #D9D282 rgb(217,210,130) hsl(55,53%,68%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Terminal yellow. Warning texts and markers. Diff modification indicators. Code: Builtin varable and function identifiers. Markdown headings.
Paramo F/L #AECC8F rgb(174,204,143) hsl(90,37%,68%)	Unknown F/L #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Terminal green. Code: In general, used for precedure identifiers like function, method, constructor, and macro names, except builtin ones (see amber swatch).
Lichen F/L #8FCCB8 rgb(143,204,184) hsl(160,37%,68%)	Unknown F/L #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Terminal cyan. Code: In general, used for variable identifiers like standard variable, function parameter, and user-defined constant names, except builtin ones (see amber swatch).
Denim O/S #99A9FF rgb(153,169,255) hsl(231,100%,80%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Terminal blue. Info texts and markers. Info indicators. Diff moved indicators. Code: All procedure-related and storage-related keywords like var, let, const, mut, ref, def, class, function, etc.
Nightfog O/S #3D5866 rgb(61,88,102) hsl(200,25%,32%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Terminal black. Line numbers. Inactive text. Window/panel separators. Prominent hidden text. Code: No usage.
Beige O/S #F2D2C2 rgb(242,210,194) hsl(20,65%,85%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Terminal white. Code: Highlights.
Fuchia O/S #D977B7 rgb(217,119,183) hsl(321,56%,66%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: No usage. Code: Logical, mathematical, and other operators. Special symbols like ? in Rust, ... in Hare. Markdown list dashes.
Orange O/S #D9916D rgb(217,145,109) hsl(20,59%,64%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: No usage. Code: Character, numeric, and special constant literals like true, false, none, etc. Other special constants like escape codes. Markdown italic text.
Forest O/S #85CC85 rgb(133,204,133) hsl(120,41%,66%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Insert mode indicators in modal editors. Diff addition indicators. Code: HTML/XML tag names (note that JSX tag names might be styled using constructor assigned swatches).
Teal O/S #70BCCC rgb(112,188,204) hsl(190,47%,62%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: No usage. Code: Type identifiers including user-defined and builtin. Markdown quotes.
Khaki O/S #CCB1A3 rgb(204,177,163) hsl(20,29%,72%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Normal mode indicators in modal editors. Primary cursor background. Code: No usage.
Mist F/L #95A69E rgb(149,166,158) hsl(152,9%,62%)	Unknown F/L #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Default text. Current (highlighted) line numbers text. Code: Default text.
Arequipe F/L #B39B6B rgb(179,155,107) hsl(40,32%,56%)	Unknown F/L #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: No usage. Code: String literals. Regular expression literals. URLs. Markdown links.
Olive F/L #B3B36B rgb(179,179,107) hsl(60,32%,56%)	Unknown F/L #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: No usage. Code: HTML/XML tag attributes. Class attributes (note that JSX tag attributes might be styled using method assigned swatches). Markdown inline code block.
Tan F/L #99857A rgb(153,133,122) hsl(21,13%,54%)	Unknown F/L #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Auxiliar UI text and decorations. Code: No usage.
Terracota F/L #996B6B rgb(153,107,107) hsl(0,18%,51%)	Unknown F/L #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Secondary cursor background. Code: Commas, colons and other punctuation delimiters depending on the language.
Umber F/L #806F4C rgb(128,111,76) hsl(40,25%,40%)	Unknown F/L #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: No usage. Code: Any punctuation symbol including brackets like parentheses, angle brackets, etc. but except punctuation delimiters (see terracota swatch) and special punctuation (see slate swatch).
Slate F/L #518C83 rgb(81,140,131) hsl(171,27%,43%)	Unknown F/L #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Inlay hints. Code: Special punctuation like string interpolation brackets, etc. Markdown strikethrough text.
Steel F/L #517373 rgb(81,115,115) hsl(180,17%,38%)	Unknown F/L #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Interactive text (virtual text). Code: Comments including doc comments as well.
Bg00 O/S #131D1F rgb(19,29,31) hsl(190,24%,10%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Pane borders. Status line background. Primary cursor text. Code: No usage.
Bg05 O/S #172226 rgb(23,34,38) hsl(196,25%,12%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: No usage. Code: No usage.
Bg10 F/L #1C282E rgb(28,40,46) hsl(200,24%,15%)	Unknown F/L #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Main background. Code: No usage.
Bg15 O/S #212D36 rgb(33,45,54) hsl(206,24%,17%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Secondary special line and column indicators like cursorline, columnline, and virtual rulers, except primary ones (see bg20 swatch). Code: No usage.
Bg20 O/S #25313D rgb(37,49,61) hsl(210,24%,19%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Primary special line and column indicators like cursorline, columnline except secondary ones (see bg15 swatch). Code: No usage.
Bg25 F/L #2A3545 rgb(42,53,69) hsl(216,24%,22%)	Unknown F/L #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Popups and dialog boxes background. Code: No usage.
Bg30 O/S #2F394D rgb(47,57,77) hsl(220,24%,24%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: No usage. Code: No usage.
Bg35 F/L #363E54 rgb(54,62,84) hsl(224,22%,27%)	Unknown F/L #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: All selected text backgrounds including primary and secondary. Code: No usage.
Bg40 F/L #3C415C rgb(60,65,92) hsl(231,21%,30%)	Unknown F/L #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: No usage. Code: Special characters like whitespace, indent, and end of line markers.
Bg45 O/S #414463 rgb(65,68,99) hsl(235,21%,32%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Highlighted lines background when selected by the user. Scroll bar background. Code: No usage.
YellowBg O/S #403F37 rgb(64,63,55) hsl(53,8%,23%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Background for text notifying warnings to the user. Code: No usage.
RedBg O/S #453434 rgb(69,52,52) hsl(0,14%,24%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Background for text notifying errors to the user. Code: No usage.
BlueBg O/S #334455 rgb(51,68,85) hsl(210,25%,27%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Background for text notifying neutral info to the user. Code: No usage.
MagentaBg O/S #473947 rgb(71,57,71) hsl(300,11%,25%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Background for text notifying hints to the user. Code: No usage.
GreenBg O/S #3C4841 rgb(60,72,65) hsl(145,9%,26%)	Unknown O/S #888888 rgb(136,136,136) hsl(0,0%,53%)
UI: Background for text notifying success status to the user. Code: No usage.