Skip to main content
Coding Theme

Color themes

Zed preview

macOS Zed window using this variant's theme style.

colors

UI color keys from this variant's theme style.

keyHEXRGBRGBA
background
border
border.disabled
border.focused
border.selected
border.variant
conflict
conflict.background
conflict.border
created
created.background
created.border
deleted
deleted.background
deleted.border
drop_target.background
editor.active_line_number
editor.active_line.background
editor.active_wrap_guide
editor.background
editor.document_highlight.bracket_background
editor.document_highlight.read_background
editor.document_highlight.write_background
editor.foreground
editor.gutter.background
editor.highlighted_line.background
editor.indent_guide
editor.indent_guide_active
editor.invisible
editor.line_number
editor.subheader.background
editor.wrap_guide
element.active
element.background
element.disabled
element.hover
element.selected
elevated_surface.background
error
error.background
error.border
ghost_element.active
ghost_element.hover
ghost_element.selected
hidden
hidden.background
hidden.border
hint
hint.background
hint.border
icon
icon.accent
icon.disabled
icon.muted
icon.placeholder
ignored
ignored.background
ignored.border
info
info.background
info.border
link_text.hover
modified
modified.background
modified.border
panel.background
panel.focused_border
player.0.background
player.0.cursor
player.0.selection
player.1.background
player.1.cursor
player.1.selection
player.2.background
player.2.cursor
player.2.selection
player.3.background
player.3.cursor
player.3.selection
player.4.background
player.4.cursor
player.4.selection
player.5.background
player.5.cursor
player.5.selection
player.6.background
player.6.cursor
player.6.selection
player.7.background
player.7.cursor
player.7.selection
predictive
predictive.background
predictive.border
renamed
renamed.background
renamed.border
scrollbar.thumb.background
scrollbar.thumb.hover_background
search.match_background
status_bar.background
success
success.background
success.border
surface.background
tab_bar.background
tab.active_background
tab.inactive_background
terminal.ansi.black
terminal.ansi.blue
terminal.ansi.bright_black
terminal.ansi.bright_blue
terminal.ansi.bright_cyan
terminal.ansi.bright_green
terminal.ansi.bright_magenta
terminal.ansi.bright_red
terminal.ansi.bright_white
terminal.ansi.bright_yellow
terminal.ansi.cyan
terminal.ansi.green
terminal.ansi.magenta
terminal.ansi.red
terminal.ansi.white
terminal.ansi.yellow
terminal.background
terminal.bright_foreground
terminal.dim_foreground
terminal.foreground
text
text.accent
text.disabled
text.muted
text.placeholder
title_bar.background
title_bar.inactive_background
toolbar.background
unreachable
unreachable.background
unreachable.border
warning
warning.background
warning.border

syntax

Syntax capture colors from the theme style. Italic and bold are not listed — the preview above shows them in the code.

captureHEXRGBRGBA
at_keyword
attribute
attribute.builtin
boolean
class
class_name
color
comment
comment.doc
constant
constant.color
constant.css
constructor
decorator
diff.delta
diff.minus
diff.plus
embedded
function
function.builtin
function.call
function.method
function.method.call
function.special.definition
id_name
keyword
keyword.control.at-rule
keyword.directive
keyword.important
keyword.operator
label
link_text
link_uri
markup.bold
markup.heading
markup.italic
markup.link.text
markup.link.url
markup.list
markup.list.numbered
markup.list.unnumbered
markup.quote
markup.raw
markup.raw.block
markup.raw.inline
markup.strikethrough
method_definition
namespace
number
number.unit
operator
plain_value
predictive
preproc
primary
property
property_identifier
property_name
property.css
property.custom
property.definition
property.object
pseudo_class_selector
pseudo_element_selector
punctuation
punctuation.bracket
punctuation.delimiter
punctuation.list_marker
punctuation.special
selector.class
selector.id
selector.pseudo
self
shorthand_property_identifier
shorthand_property_identifier_pattern
string
string.escape
string.plain
string.regex
string.special
string.special.symbol
string.template
tag
tag_name
tag.component
tag.css
tag.jsx
template_string
text.literal
this
title
type
type.builtin
type.class
unit
value
variable
variable.builtin
variable.css
variable.language
variable.member
variable.parameter
variable.scss
variable.special

settings.json

Search for "Pierre" in the Zed extensions store, then paste the settings below.

{
  "theme": {
    "mode": "system",
    "light": "Pierre Light",
    "dark": "Pierre Dark"
  }
}

Theme file