---@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