152 lines
4.0 KiB
Lua
152 lines
4.0 KiB
Lua
---@class N8nPalette
|
|
local M = {}
|
|
|
|
-- n8n Design System palette
|
|
-- Extracted from the official n8n dark theme CSS custom properties
|
|
|
|
-- Neutrals (the backbone of n8n's dark UI)
|
|
M.neutral_white = "#ffffff"
|
|
M.neutral_50 = "#fcfcfc"
|
|
M.neutral_100 = "#f9f9f9"
|
|
M.neutral_125 = "#f5f5f5"
|
|
M.neutral_150 = "#ededed"
|
|
M.neutral_200 = "#e0e0e0"
|
|
M.neutral_250 = "#cccccc"
|
|
M.neutral_300 = "#adadad"
|
|
M.neutral_400 = "#949494"
|
|
M.neutral_500 = "#828282"
|
|
M.neutral_600 = "#757575"
|
|
M.neutral_700 = "#4d4d4d"
|
|
M.neutral_750 = "#424242"
|
|
M.neutral_800 = "#3d3d3d"
|
|
M.neutral_850 = "#2b2b2b"
|
|
M.neutral_900 = "#212121"
|
|
M.neutral_950 = "#171717"
|
|
M.neutral_black = "#000000"
|
|
|
|
-- Orange (n8n's brand accent in dark mode)
|
|
M.orange_50 = "#fff6f5"
|
|
M.orange_100 = "#ffe8e6"
|
|
M.orange_150 = "#ffdfdb"
|
|
M.orange_200 = "#ffc9c2"
|
|
M.orange_250 = "#ff9c8f"
|
|
M.orange_300 = "#ff6f5c"
|
|
M.orange_400 = "#ff4b33"
|
|
M.orange_500 = "#ff1e00"
|
|
M.orange_600 = "#cc1800"
|
|
M.orange_700 = "#991200"
|
|
M.orange_800 = "#660c00"
|
|
M.orange_900 = "#330600"
|
|
M.orange_950 = "#1a0300"
|
|
|
|
-- Purple (used for pinned nodes, code syntax, accents)
|
|
M.purple_50 = "#f8f7fc"
|
|
M.purple_100 = "#edecf8"
|
|
M.purple_200 = "#e6e4f6"
|
|
M.purple_300 = "#c3bee9"
|
|
M.purple_400 = "#a098dc"
|
|
M.purple_500 = "#7d72cf"
|
|
M.purple_600 = "#5a4cc2"
|
|
M.purple_700 = "#4438a3"
|
|
M.purple_800 = "#3b308d"
|
|
M.purple_900 = "#302772"
|
|
M.purple_950 = "#211b50"
|
|
|
|
-- Green (success states, boolean/number syntax)
|
|
M.green_50 = "#ebfaf1"
|
|
M.green_100 = "#d6f5e3"
|
|
M.green_200 = "#adebc7"
|
|
M.green_300 = "#85e0ac"
|
|
M.green_400 = "#5cd693"
|
|
M.green_500 = "#33cc78"
|
|
M.green_600 = "#29a360"
|
|
M.green_700 = "#1f7a48"
|
|
M.green_800 = "#19663d"
|
|
M.green_900 = "#145231"
|
|
M.green_950 = "#0a291a"
|
|
|
|
-- Mint (chat user backgrounds, alternative green)
|
|
M.mint_500 = "#16e975"
|
|
M.mint_600 = "#13cd67"
|
|
M.mint_700 = "#0d8c46"
|
|
|
|
-- Red (danger, errors, diagnostics)
|
|
M.red_50 = "#fef1f2"
|
|
M.red_100 = "#fcdadd"
|
|
M.red_200 = "#faccd0"
|
|
M.red_250 = "#f7abb1"
|
|
M.red_300 = "#f5949c"
|
|
M.red_400 = "#f16a75"
|
|
M.red_500 = "#ee4452"
|
|
M.red_600 = "#ea1f30"
|
|
M.red_700 = "#c41221"
|
|
M.red_800 = "#ad101d"
|
|
M.red_900 = "#7e0c15"
|
|
M.red_950 = "#4f070d"
|
|
|
|
-- Blue (info states, links, selections)
|
|
M.blue_50 = "#eaf2fb"
|
|
M.blue_100 = "#ddebf8"
|
|
M.blue_200 = "#b2d1f0"
|
|
M.blue_300 = "#7fb3e6"
|
|
M.blue_400 = "#4891db"
|
|
M.blue_500 = "#2878c8"
|
|
M.blue_600 = "#236bb3"
|
|
M.blue_700 = "#1b5288"
|
|
M.blue_800 = "#13385e"
|
|
M.blue_900 = "#081a2b"
|
|
|
|
-- Yellow (warnings, sticky notes)
|
|
M.yellow_100 = "#fff5d6"
|
|
M.yellow_200 = "#ffe48a"
|
|
M.yellow_300 = "#ffdb66"
|
|
M.yellow_400 = "#ffcf33"
|
|
M.yellow_500 = "#ffc400"
|
|
M.yellow_600 = "#cc9c00"
|
|
M.yellow_700 = "#a37d00"
|
|
M.yellow_800 = "#705600"
|
|
M.yellow_900 = "#332700"
|
|
|
|
-- Gold (alternative warm accent)
|
|
M.gold_50 = "#fdf9f1"
|
|
M.gold_100 = "#f7e3c4"
|
|
M.gold_200 = "#f4d8ae"
|
|
M.gold_300 = "#efc381"
|
|
M.gold_400 = "#e6a23d"
|
|
M.gold_500 = "#d48a1c"
|
|
M.gold_600 = "#b57617"
|
|
M.gold_700 = "#905e13"
|
|
M.gold_800 = "#63410d"
|
|
M.gold_900 = "#2d1d06"
|
|
|
|
-- Slate (alternative neutral with blue tint)
|
|
M.slate_100 = "#e4e3e8"
|
|
M.slate_200 = "#c8c7d1"
|
|
M.slate_300 = "#adabba"
|
|
M.slate_400 = "#928fa3"
|
|
M.slate_500 = "#76738c"
|
|
M.slate_600 = "#5f5c70"
|
|
M.slate_700 = "#474554"
|
|
M.slate_800 = "#2f2e38"
|
|
M.slate_900 = "#18171c"
|
|
|
|
-- n8n brand pink (logo, marketing)
|
|
M.brand_pink = "#EA4B71"
|
|
M.brand_dark = "#101330"
|
|
|
|
-- Assistant/AI highlight gradient stops
|
|
M.highlight_1 = "#8c90f2"
|
|
M.highlight_2 = "#a977f0"
|
|
M.highlight_3 = "#f0778b"
|
|
|
|
-- Node icon accent colors (from the canvas)
|
|
M.icon_blue = "#898fff"
|
|
M.icon_light_blue = "#58abff"
|
|
M.icon_dark_blue = "#7ba7ff"
|
|
M.icon_pink_red = "#f85d82"
|
|
|
|
-- Special
|
|
M.none = "NONE"
|
|
|
|
return M
|