Skip to content

Framer

Framer is a soft, dark terminal color scheme with a #111111 background and #777777 text (4.2:1 contrast)

Get config
Background
#111111
Foreground
#777777
Text contrast
4.22:1AA Large
Accent contrast
10.78:1min 6.01
zsh — ls & git status
zsh — ls & git status
zsh — ls & git status
zsh — ls & git status
zsh — ls & git status — Konsole
~/dev/tintdex on main [!?] via ⬢ v1.4.3
❯ ls -la
drwxr-xr-x 12 ada staff 384 Oct 30 09:12 .
drwxr-xr-x 8 ada staff 256 Oct 29 18:40 ..
-rw-r--r-- 1 ada staff 1.2K Oct 30 09:10 .gitignore
drwxr-xr-x 5 ada staff 160 Oct 30 09:12 src
drwxr-xr-x 3 ada staff 96 Oct 28 11:02 public
-rwxr-xr-x 1 ada staff 2.4K Oct 30 08:57 build.sh
-rw-r--r-- 1 ada staff 4.1K Oct 30 09:01 package.json
lrwxr-xr-x 1 ada staff 18 Oct 27 14:33 node_modules -> ../cache/modules
-rw-r--r-- 1 ada staff 48K Oct 26 10:15 logo.png
-rw-r--r-- 1 ada staff 9.8M Oct 25 21:47 backup.tar.gz
~/dev/tintdex on main [!?] via ⬢ v1.4.3
❯ git status
On branch main
Your branch is ahead of 'origin/main' by 2 commits.
Changes to be committed:
new file: src/theme.css
modified: README.md
Changes not staged for commit:
modified: src/app.tsx
deleted: legacy/colors.js
Untracked files:
notes.md
~/dev/tintdex on main [!?] via ⬢ v1.4.3
❯

Framer configs

16 formats, all from one palette

Framer

Save to ~/.config/ghostty/themes/Framer, then set theme = Framer in config or config.ghostty

More Ghostty themes
Raw file
# Theme: Framer (Ghostty)
# Preview & customize online: https://tintdex.afengim.com/en/schemes/framer?format=ghostty

palette = 0=#141414
palette = 1=#ff5555
palette = 2=#98ec65
palette = 3=#ffcc33
palette = 4=#00aaff
palette = 5=#aa88ff
palette = 6=#88ddff
palette = 7=#cccccc
palette = 8=#414141
palette = 9=#ff8888
palette = 10=#b6f292
palette = 11=#ffd966
palette = 12=#33bbff
palette = 13=#cebbff
palette = 14=#bbecff
palette = 15=#ffffff
background = #111111
foreground = #777777
cursor-color = #fcdc08
cursor-text = #161616
selection-background = #666666
selection-foreground = #ffffff

Framer palette

Palette color values and WCAG contrast ratios against the background
ColorSlotHEXRGBHSLOKLCHContrast
Backgroundbackground#111111rgb(17 17 17)hsl(0 0% 7%)oklch(17.8% 0.000 0)—
Foregroundforeground#777777rgb(119 119 119)hsl(0 0% 47%)oklch(56.9% 0.000 0)4.22 AA Large
Cursorcursor#fcdc08rgb(252 220 8)hsl(52 98% 51%)oklch(89.4% 0.184 98.5)13.83 AAA
Cursor textcursorText#161616rgb(22 22 22)hsl(0 0% 9%)oklch(20.0% 0.000 0)1.04 Fail
Selectionselection#666666rgb(102 102 102)hsl(0 0% 40%)oklch(51.0% 0.000 0)3.29 AA Large
Selection textselectionText#ffffffrgb(255 255 255)hsl(0 0% 100%)oklch(100.0% 0.000 0)18.88 AAA
Blackcolor0#141414rgb(20 20 20)hsl(0 0% 8%)oklch(19.1% 0.000 0)1.02 Fail
Redcolor1#ff5555rgb(255 85 85)hsl(0 100% 67%)oklch(68.2% 0.206 24.4)6.01 AA
Greencolor2#98ec65rgb(152 236 101)hsl(97 78% 66%)oklch(86.1% 0.188 135.3)13.06 AAA
Yellowcolor3#ffcc33rgb(255 204 51)hsl(45 100% 60%)oklch(86.7% 0.165 88.7)12.53 AAA
Bluecolor4#00aaffrgb(0 170 255)hsl(200 100% 50%)oklch(70.7% 0.168 242.0)7.37 AAA
Magentacolor5#aa88ffrgb(170 136 255)hsl(257 100% 77%)oklch(70.9% 0.170 294.8)6.90 AA
Cyancolor6#88ddffrgb(136 221 255)hsl(197 100% 77%)oklch(85.6% 0.095 225.6)12.44 AAA
Whitecolor7#ccccccrgb(204 204 204)hsl(0 0% 80%)oklch(84.5% 0.000 0)11.76 AAA
Bright Blackcolor8#414141rgb(65 65 65)hsl(0 0% 25%)oklch(37.5% 0.000 0)1.85 Fail
Bright Redcolor9#ff8888rgb(255 136 136)hsl(0 100% 77%)oklch(75.8% 0.145 21.0)8.21 AAA
Bright Greencolor10#b6f292rgb(182 242 146)hsl(97 79% 76%)oklch(89.8% 0.139 134.5)14.48 AAA
Bright Yellowcolor11#ffd966rgb(255 217 102)hsl(45 100% 70%)oklch(89.6% 0.139 91.1)13.82 AAA
Bright Bluecolor12#33bbffrgb(51 187 255)hsl(200 100% 60%)oklch(75.1% 0.148 236.3)8.72 AAA
Bright Magentacolor13#cebbffrgb(206 187 255)hsl(257 100% 87%)oklch(83.1% 0.096 297.1)10.95 AAA
Bright Cyancolor14#bbecffrgb(187 236 255)hsl(197 100% 87%)oklch(91.5% 0.057 223.6)14.89 AAA
Bright Whitecolor15#ffffffrgb(255 255 255)hsl(0 0% 100%)oklch(100.0% 0.000 0)18.88 AAA

About Framer

Framer is a dark terminal color scheme built on a neutral #111111 background with #777777 as the default foreground. Body text reaches a 4.22:1 WCAG contrast ratio (AA Large), while the 12 ANSI accent colors average 10.78:1 (minimum 6.01:1).

Its palette is moderately saturated, anchored by #ff5555 red, #98ec65 green, #00aaff blue, and #aa88ff magenta.

Ready-to-use configs can be exported for Ghostty, iTerm2, Kitty, Alacritty, WezTerm, Windows Terminal, Warp, foot, Rio, XFCE4 Terminal, and Xresources, along with VS Code and Zed integrated terminals, CSS variables, Tailwind CSS, and JSON.

Schemes similar to Framer

Source: iTerm2 Color Schemes (MIT)