Skip to content

Sidra Theme - A super customizable, balanced dark theme for Helix #13575

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
212 changes: 212 additions & 0 deletions runtime/themes/sidra.toml
Original file line number Diff line number Diff line change
@@ -0,0 +1,212 @@
# License: MIT License
# Sidra Theme for the Helix Editor
# Author: Md Atiquz Zaman <[email protected]>
# Repo: https://github.com/atiquz/sidra
# Inspired by: One Monokai, Dracula, One Dark Pro
# Description: A customizable, balanced dark theme built for readability and flexibility.


# ===========================
# UI Element Styling
# ===========================


# USER INTERFACE
"ui.background" = { fg = "foreground", bg = "background" }
"ui.background.separator" = { fg = "white" }

"ui.linenr" = { fg = "fg_linenr" }
"ui.linenr.selected" = { fg = "fg_linenr_sld" }

"ui.help" = { fg = "fg_help", bg = "bg_help" }
"ui.popup" = { bg = "bg_popup" }
"ui.window" = { fg = "fg_window" }

"ui.text" = { fg = "fg_text" }
"ui.text.focus" = { fg = "fg_text_focus" }
"ui.text.inactive" = { fg = "fg_text_inactive" }

"ui.virtual" = { fg = "fg_virtual" }
"ui.virtual.ruler" = { bg = "bg_virtual_ruler" }
"ui.virtual.indent-guide" = { fg = "fg_virtual_indent" }

"ui.debug" = { fg = "fg_debug", modifiers = ["bold"] }
"ui.debug.active" = { fg = "fg_debug_active", modifiers = ["bold"] }
"ui.debug.breakpoint" = { fg = "fg_debug_breakpoint", modifiers = ["bold"] }

"ui.menu" = { fg = "gray", bg = "black" }
"ui.menu.selected" = { fg = "black", bg = "gray" }

# CURSOR
"ui.cursor" = { fg = "foreground", bg = "bg_normal", modifiers = ["dim"] }
"ui.cursor.match" = { fg = "foreground", bg = "bg_match", modifiers = ["dim"] }
"ui.cursor.normal" = { fg = "background", bg = "bg_normal", modifiers = ["dim"] }
"ui.cursor.insert" = { fg = "background", bg = "bg_insert", modifiers = ["dim"] }
"ui.cursor.select" = { fg = "background", bg = "bg_select", modifiers = ["dim"] }
"ui.cursor.primary.normal" = { fg = "background", bg = "bg_normal" }
"ui.cursor.primary.insert" = { fg = "background", bg = "bg_insert" }
"ui.cursor.primary.select" = { fg = "background", bg = "bg_select" }
"ui.cursorline" = { bg = "bg_cursorline" }
"ui.cursorline.primary" = { bg = "bg_cursorline" }


# SELECTION
"ui.selection" = { fg = "white", bg = "bg_selection" }
"ui.selection.primary" = { fg = "white", bg = "bg_selection" }


# STATUS LINE
"ui.statusline" = { fg = "fg_statusline", bg = "bg_statusline" }
"ui.statusline.inactive" = { fg = "fg_inactive", bg = "bg_inactive" }
"ui.statusline.normal" = { fg = "black", bg = "bg_normal", modifiers = ["bold"] }
"ui.statusline.insert" = { fg = "black", bg = "bg_insert", modifiers = ["bold"] }
"ui.statusline.select" = { fg = "black", bg = "bg_select", modifiers = ["bold"] }

# MARKUP
"markup.heading" = { fg = "markup_heading" }
"markup.bold" = { fg = "markup_bold", modifiers = ["bold"] }
"markup.italic" = { fg = "markup_italic", modifiers = ["italic"] }
"markup.strikethrough" = { fg = "markup_strikethrough", modifiers = ["crossed_out", "bold"] }
"markup.link.url" = { fg = "markup_link_url", modifiers = ["underlined"] }
"markup.link.text" = { fg = "markup_link_text" }
"markup.raw" = { fg = "markup_raw" }


# GIT
"diff.plus" = { fg = "plus", modifiers = ["bold"] }
"diff.minus" = { fg = "minus", modifiers = ["bold"] }
"diff.delta" = { fg = "delta", modifiers = ["bold"] }


# HINT INFO ERROR & WARNING
"diagnostic.hint" = { underline = { color = "bright-yellow", style = "curl" } }
"diagnostic.info" = { underline = { color = "bright-yellow", style = "curl" } }
"diagnostic.error" = { underline = { color = "bright-pink", style = "curl" } }
"diagnostic.warning" = { underline = { color = "bright-yellow", style = "curl" } }

hint = "bright-yellow"
info = "bright-yellow"
error = "bright-pink"
warning = "bright-yellow"


# ===========================
# SYNTAX COLORS
# ===========================


# === ATTRIBUTES & KEYWORDS ===
attribute = "#a7bf67" # Olive green
keyword = "#A4A2B4" # Muted lavender gray
"keyword.directive" = "#D3D3D3" # Light gray (used to be "light-gray")
namespace = "#7095bf" # Steel blue

# === SYMBOLS & OPERATORS ===
punctuation = "#FFFFFF" # White
"punctuation.delimiter" = "#FFFFFF" # White (delimiter punctuation)
operator = "#987654" # Dusty brown (used to be "muddy")
special = "pink" # Pink Color

# === VARIABLES ===
variable = "#7ec67f" # Soft green
"variable.other.member" = "#7ec67f" # Soft green (class or object members)
"variable.parameter" = "#a8ffb4" # Pale mint green
"variable.builtin" = "#a8ffb4" # Pale mint green (special language vars)

# === TYPES ===
type = "#efbe4c" # Golden yellow
"type.builtin" = "#efbe4c" # Golden yellow (built-in types)
constructor = "#c19ef7" # Light lilac

# === FUNCTIONS ===
function = "#987654" # Dusty brown (used to be "muddy")
"function.macro" = "#987654" # Dusty brown (macro functions)
"function.builtin" = "#db985e" # Orange tan

# === TAGS ===
tag = "#d37a78" # Soft salmon pink

# === COMMENTS ===
comment = "#D3D3D3" # Light gray

# === CONSTANTS ===
constant = "#A5C4D4" # Pale blue
"constant.builtin" = "#f1fa8c" # Bright yellow
"constant.numeric" = "#b577b0" # Muted violet
"constant.character.escape" = "#c95c56" # Coral red (escape characters)

# === STRINGS ===
string = "#d6a560" # Sandy yellow-orange

# === LABELS ===
label = "#abcc8a" # Pale green



# ===========================
# Color Palette
# ===========================

[palette]

# ===== MODES COLORS =====

bg_normal = "#BD93F9" # Light purple
bg_insert = "#50fa7b" # Neon green
bg_select = "#8be9fd" # Cyan blue
bg_match = "#D3D3D3" # Light gray

# ===== GIT COLORS =====

plus = "#4F6F52" # Forest green
minus = "#B80000" # Vivid red
delta = "#3876BF" # Steel blue

# ===== MARKUP COLORS =====

markup_heading = "#ff69b4" # Hot pink
markup_bold = "#e7c547" # Bright yellow
markup_italic = "#b294bb" # Lavender
markup_strikethrough = "#d7005f" # Deep pink-red
markup_link_url = "#3876BF" # Steel blue
markup_link_text = "#FFA500" # Orange
markup_raw = "#808080" # Medium gray

# ===== PRIMARY UI COLORS =====

foreground = "#D3D3D3" # Light gray (default text)
background = "#1f1f21" # Very dark gray (background)

# ===== UI INTERFACE COLORS =====

fg_linenr = "#747575" # Dull silver (line numbers)
fg_linenr_sld = "#c7dddd" # Light cyan (selected line number)
fg_help = "#D3D3D3" # Light gray (help text)
bg_help = "#35353a" # Charcoal (help background)
bg_popup = "#3b3b3d" # Dark gray (popup background)
fg_window = "#F1DCA7" # Soft cream (window border/title)

fg_text = "#D3D3D3" # Light gray (main text)
fg_text_focus = "#83c679" # Light green (focused text)
fg_text_inactive = "#93a56f" # Olive green (inactive text)

# ===== VIRTUAL COLORS =====

fg_virtual = "#F1DCA7" # Cream (virtual text)
bg_virtual_ruler = "#363638" # Deep gray (ruler background)
fg_virtual_indent = "#5B5B5A" # Medium-dark gray (indent guides)

# ===== DEBUGGING COLORS =====

fg_debug = "#634450" # Plum (debug info)
fg_debug_active = "#3876BF" # Blue (active debug line)
fg_debug_breakpoint = "#B80000" # Red (breakpoint marker)

# ===== CURSOR, SELECTION, STATUSLINE =====

bg_cursorline = "#2d303e" # Slate blue-gray (cursor line)
bg_selection = "#71797E" # Cool gray (selected text background)
fg_statusline = "#D3D3D3" # Light gray (statusline text)
bg_statusline = "#303030" # Dark gray (statusline background)
fg_inactive = "#4b5059" # Dim gray (inactive statusline text)
bg_inactive = "#303030" # Dark gray (inactive statusline bg)