simulator/src/themer/themes.js
export default {
"Default Theme": {
"--text-navbar--alt": "#000",
"--br-secondary": "#7d7d7d",
"--br-circuit-cur": "#fff",
"--br-circuit": "#fff",
"--cus-radio_label": "#656565",
"--primary": "#454545",
"--text-lite": "#fff",
"--text-dark": "#000",
"--text-panel": "white",
"--bg-navbar": "#454545",
"--qp-br-tl": "#333333",
"--qp-br-rd": "#535353",
"--qp-box-shadow-1": "#3b3b3b",
"--qp-box-shadow-2": "#4f4f4f",
"--bg-circuit": "#ddd",
"--br-circuit": "#454545",
"--br-primary": "#fff",
"--bg-primary-moz": "#454545e6",
"--bg-primary-chr": "#454545b3",
"--bg-tabs": "#8b8b8b",
"--bg-icons": "#7d7d7d",
"--bg-text": "#cacaca",
"--bg-secondary": "#bbbbbb",
"--canvas-stroke": "#eee",
"--canvas-fill": "white",
"--context-text": "white",
"--bg-toggle-btn-primary": "#42b983",
"--primary-btn-hov": "#3ca877",
"--btn-danger": "#dc5656",
"--btn-danger-darken": "#b03662",
"--disable": "#6c8b93",
"--cus-btn-hov--bg": "#ddd",
"--cus-btn-hov-text": "#000",
"--node": "green",
"--stroke": "black",
"--fill": "white",
"--hover-and-sel": "rgba(255, 255, 32, 0.8)",
"--wire-draw": "black",
"--wire-cnt": "green",
"--wire-pow": "lightgreen",
"--wire-sel": "blue",
"--wire-lose": "red",
"--mini-map": "green",
"--mini-map-stroke": "darkgreen",
"--input-text": "green",
"--secondary-stroke": "red",
"--text": "black",
"--wire-norm": "black",
"--node-norm": "green",
"--splitter": "black",
"--output-rect": "blue",
"--disable": "#6c8b93",
"--touch-menu": "#7d7d7d",
},
"Night Sky": {
"--text-navbar--alt": "#fff",
"--br-secondary": "#665627",
"--cus-radio_label": "#0F111A",
"--primary": "#0F111A", //header bg, panels bg
"--text-lite": "#FFF", //normal state text
"--text-dark": "white", //text state on hover, on drop down menu , context menu
"--text-panel": "white",
"--bg-navbar": "#0F111A",
"--br-circuit": "#0F111A", //panel border, tabbar circuit border
"--br-primary": "#665627", //panel border, tabbar circuit border
"--br-circuit-cur": "#cccccc",
"--bg-circuit": "#bdc2ca",
"--bg-primary-moz": "#0f111ae6", //dialog bg
"--bg-primary-chr": "#0f111ab3", //dialog bg
"--bg-tabs": "#727d8d", //tabs bar primary bg,
"--bg-icons": "#4d647a", //ce icon bg
"--bg-text": "#727d8d", //drop down, content menu, text bg on hover
"--bg-secondary": "#536c84", //border color input button,
"--canvas-fill": "#1B2C33", //canvas bg
"--canvas-stroke": "#6A7980", //canvas stroke
"--context-text": "white",
"--bg-toggle-btn-primary": "#48a69d",
"--primary-btn-hov": "#3f9189",
"--btn-danger": "#c33c6c",
"--btn-danger-darken": "#b03662",
"--qp-br-tl": "#282d46", //more ligthen than qp box shadow 1
"--qp-br-rd": "#1d2132",
"--qp-box-shadow-1": "#1d2132", //lil lighten base
"--qp-box-shadow-2": "#0a0b11", //lil darken base
"--cus-btn-hov--bg": "#48a69d",
"--cus-btn-hov-text": "#fff",
"--node": "#285963",
"--stroke": "#35aea9",
"--fill": "#DEFFFE",
"--hover-and-sel": "#E3B924",
"--wire-draw": "#77878C",
"--wire-cnt": "#3B7F58",
"--wire-pow": "#75FFB0",
"--wire-sel": "#208CC9",
"--wire-lose": "#BF0426",
"--mini-map": "#3B7F58",
"--mini-map-stroke": "#607F6E",
"--input-text": "#3B7F58",
"--output-rect": "#0487D9",
"--secondary-stroke": "#BF0426",
"--text": "#E9FBF8",
"--wire-norm": "#277F7C",
"--node-norm": "#FFC231",
"--splitter": "#0284A8",
"--disable": "#4F74B0",
"--touch-menu": "#665627",
},
"Lite-born Spring": {
"--text-navbar--alt": "#000",
"--br-secondary": "#6B6B6B",
"--cus-radio_label": "#6B6B6B",
"--primary": "#EAEAEB", //header bg
"--text-dark": "#6B6B6B", //normal state text
"--text-lite": "white", //text state on hover, on drop down menu , context menu
"--text-panel": "#6B6B6B",
"--bg-navbar": "#6b6b6b",
"--qp-br-tl": "#969696", //more ligthen than qp box shadow 1
"--qp-br-rd": "#545454",
"--qp-box-shadow-1": "#747474", //lil lighten base .. top left shadow
"--qp-box-shadow-2": "#5f5f5f", //lil darken base //down right shadow
// "--bg-tabs": "#EAEAEB", //tabs bar primary bg,
"--bg-tabs": "#A4A4A4", //tabs bar primary bg,
"--br-circuit-cur": "#42B983",
"--bg-circuit": "#D7D7D7",
"--br-circuit": "#42B983",
"--br-primary": "#42B983", //panel border, tabbar circuit border
"--context-text-hov": "#6B6B6B",
"--context-text": "white",
"--bg-primary-moz": "rgba(107, 107, 107, 0.904)", //dialog bg, navbar dropwdown //.9 opacity of nav
"--bg-primary-chr": "rgba(107, 107, 107, 0.704)", //dialog bg navbar dropwdown // .7 opacity of nav
"--bg-icons": "#DDDDDD", //ce icon bg
"--bg-text": "#ddd", //drop down, content menu, text bg on hover
"--bg-secondary": "#6B6B6B", //border color input button,
"--bg-toggle-btn-primary": "#42B983",
"--primary-btn-hov": "#66C89C",
"--btn-danger": "#BF2424",
"--btn-danger-darken": "#BF414C",
"--cus-btn-hov--bg": "#42B983",
"--cus-btn-hov-text": "#fff",
"--canvas-fill": "white", //canvas bg
"--canvas-stroke": "#BABABA", //canvas stroke
"--node": "#42B983",
"--stroke": "#6B6B6B",
"--fill": "#EAEAEB",
"--hover-and-sel": "#FFE99B", //yellow
"--wire-draw": "#6B6B6B", //black
"--wire-cnt": "#42B983", //
"--wire-pow": "#52E539",
"--wire-sel": "#0FB2F2",
"--wire-lose": "#F10530",
"--mini-map": "#42B983",
"--mini-map-stroke": "#0FB2F2",
"--input-text": "#42B983",
"--output-rect": "#0487D9",
"--secondary-stroke": "#F10530",
"--text": "#454545",
"--wire-norm": "#006839",
"--node-norm": "#FFC231",
"--splitter": "#00B462",
"--disable": "#656565",
"--touch-menu": "#BBBFCA",
},
"G&W": {
"--text-navbar--alt": "#000",
"--br-secondary": "#6B6B6B",
"--cus-radio_label": "#6B6B6B",
"--primary": "#EAEAEB", //header bg
"--text-dark": "#6B6B6B", //normal state text
"--text-lite": "white", //text state on hover, on drop down menu , context menu
"--text-panel": "#656565",
"--bg-navbar": "#6b6b6b",
"--qp-br-tl": "#969696", //more ligthen than qp box shadow 1
"--qp-br-rd": "#545454",
"--qp-box-shadow-1": "#747474", //lil lighten base .. top left shadow
"--qp-box-shadow-2": "#5f5f5f", //lil darken base //down right shadow
// "--bg-tabs": "#EAEAEB", //tabs bar primary bg,
"--bg-tabs": "#A4A4A4", //tabs bar primary bg,
"--br-circuit-cur": "#6b6b6b",
"--bg-circuit": "#D7D7D7",
"--br-circuit": "#6b6b6b",
"--br-primary": "#6B6B6B", //panel border, tabbar circuit border
"--context-text-hov": "#6B6B6B",
"--context-text": "white",
"--bg-primary-moz": "rgba(107, 107, 107, 0.904)", //dialog bg, navbar dropwdown //.9 opacity of nav
"--bg-primary-chr": "rgba(107, 107, 107, 0.704)", //dialog bg navbar dropwdown // .7 opacity of nav
"--bg-icons": "#DDDDDD", //ce icon bg
"--bg-text": "#ddd", //drop down, content menu, text bg on hover
"--bg-secondary": "#6B6B6B", //border color input button,
"--bg-toggle-btn-primary": "#3ac8a4",
"--primary-btn-hov": "#71D7BD",
"--btn-danger": "#fc8771",
"--btn-danger-darken": "#FDB2A4",
"--cus-btn-hov--bg": "#3ac8a4",
"--cus-btn-hov-text": "#fff",
"--canvas-fill": "white", //canvas bg
"--canvas-stroke": "#BABABA", //canvas stroke
"--node": "#42B983",
"--stroke": "#6B6B6B",
"--fill": "#EAEAEB",
"--hover-and-sel": "#FFE99B", //yellow
"--wire-draw": "#6B6B6B", //black
"--wire-cnt": "#42B983", //
"--wire-pow": "#52E539",
"--wire-sel": "#0FB2F2",
"--wire-lose": "#F10530",
"--mini-map": "#42B983",
"--mini-map-stroke": "#0FB2F2",
"--input-text": "#42B983",
"--output-rect": "#0487D9",
"--secondary-stroke": "#F10530",
"--text": "#454545",
"--wire-norm": "#006839",
"--node-norm": "#FFC231",
"--splitter": "#00B462",
"--disable": "#656565",
"--touch-menu": "#BBBFCA",
},
"High Contrast": {
"--text-navbar--alt": "#000",
"--br-secondary": "#F38518",
"--cus-radio_label": "black",
"--primary": "black", //header bg
"--text-dark": "black", //normal state text
"--text-lite": "white", //text state on hover, on drop down menu , context menu
"--text-panel": "white",
"--bg-navbar": "black",
"--qp-br-tl": "#F38518", //more ligthen than qp box shadow 1
"--qp-br-rd": "#F38518",
"--qp-box-shadow-1": "#0D0D0D", //lil lighten base .. top left shadow
"--qp-box-shadow-2": "#0D0D0D", //lil darken base //down right shadow
"--bg-tabs": "#616161", //tabs bar primary bg,
"--text-circuit": "black",
"--br-circuit-cur": "#F38518",
"--bg-circuit": "#B6B6B6",
"--br-circuit": "#F38518",
"--br-primary": "#F38518", //panel border, tabbar circuit border
"--context-text-hov": "black",
"--context-text": "white",
"--bg-primary-moz": "rgba(0, 0, 0, 0.904)", //dialog bg, navbar dropwdown //.9 opacity of nav
"--bg-primary-chr": "rgba(0, 0, 0, 0.704)", //dialog bg navbar dropwdown // .7 opacity of nav
"--bg-icons": "#262626", //ce icon bg
"--bg-text": "#ddd", //drop down, content menu, text bg on hover
"--bg-secondary": "#6B6B6B", //border color input button,
"--bg-toggle-btn-primary": "#009599",
"--primary-btn-hov": "#00b1b6",
"--btn-danger": "#E45605",
"--btn-danger-darken": "#fa792f",
"--cus-btn-hov--bg": "#009599",
"--cus-btn-hov-text": "#fff",
"--canvas-fill": "black", //canvas bg
"--canvas-stroke": "#9ad5e9", //canvas stroke
"--node": "#26a841",
"--stroke": "#626262",
"--fill": "#d4d4d4",
"--hover-and-sel": "#ffdf6c", //yellow
"--wire-draw": "#909090", //black
"--wire-cnt": "#3bb15b", //
"--wire-pow": "#3ac53c",
"--wire-sel": "#049ffb",
"--wire-lose": "#f42f0b",
"--mini-map": "#1c2427",
"--mini-map-stroke": "#000",
"--input-text": "#42B983",
"--output-rect": "#005682",
"--secondary-stroke": "#f7081e",
"--text": "#fff",
"--wire-norm": "#00b965",
"--node-norm": "#F38518",
"--splitter": "#21de5a",
"--disable": "#262626",
"--touch-menu": "#F38518",
},
"Color Blind": {
"--text-navbar--alt": "#000",
"--br-secondary": "#e2dad1",
"--cus-radio_label": "#2e2b21",
"--primary": "#2e2b21", //header bg
"--text-dark": "black", //normal state text
"--text-lite": "white", //text state on hover, on drop down menu , context menu
"--text-panel": "white",
"--bg-navbar": "#2e2b21",
"--qp-br-tl": "#716950", //more ligthen than qp box shadow 1
"--qp-br-rd": "#6c654d",
"--qp-box-shadow-1": "#4f4a38", //lil lighten base .. top left shadow
"--qp-box-shadow-2": "#302d23", //lil darken base //down right shadow
"--bg-tabs": "#9a9a9a", //tabs bar primary bg,
"--text-circuit": "black",
"--br-circuit-cur": "#e2dad1",
"--bg-circuit": "#d6d6d6",
"--br-circuit": "#e2dad1",
"--br-primary": "#e2dad1", //panel border, tabbar circuit border
"--context-text-hov": "black",
"--context-text": "white",
"--bg-primary-moz": "rgba(46, 43, 33, 1)", //dialog bg, navbar dropwdown //.9 opacity of nav
"--bg-primary-chr": "rgba(46, 43, 33, 1)", //dialog bg navbar dropwdown // .7 opacity of nav
"--bg-icons": "#9c7762", //ce icon bg
"--bg-text": "#ddd", //drop down, content menu, text bg on hover
"--bg-secondary": "#6B6B6B", //border color input button,
"--bg-toggle-btn-primary": "#bfaac1",
"--primary-btn-hov": "#ccbbcd",
"--btn-danger": "#b66e43",
"--btn-danger-darken": "#ba7144",
"--cus-btn-hov--bg": "#b66e43",
"--cus-btn-hov-text": "#fff",
"--canvas-fill": "#fff", //canvas bg
"--canvas-stroke": "#8d88ad", //canvas stroke
"--node": "#c59434",
"--stroke": "#342a1f",
"--fill": "#e0dcd3",
"--hover-and-sel": "#f4d4d4", //yellow
"--wire-draw": "#4c4c4c", //black
"--wire-cnt": "#908eb9", //
"--wire-pow": "#b3b1cf",
"--wire-sel": "#a7b8f8",
"--wire-lose": "#f42f0b",
"--mini-map": "#4b4636",
"--mini-map-stroke": "#000",
"--input-text": "#756d54",
"--output-rect": "#092c48",
"--secondary-stroke": "#cdb1ad",
"--text": "#000",
"--wire-norm": "#7f7cae",
"--node-norm": "#c59434",
"--splitter": "#836222",
"--disable": "#956c6a",
"--touch-menu": "#A0937D",
"--table-head-dark": "#2e2b21",
},
"Custom Theme": JSON.parse(localStorage.getItem('Custom Theme')) || {
"--text-navbar--alt": "#000",
"--br-secondary": "#7d7d7d",
"--br-circuit-cur": "#ffffff",
"--br-circuit": "#ffffff",
"--cus-radio_label": "#656565",
"--primary": "#454545",
"--text-lite": "#ffffff",
"--text-dark": "#000",
"--text-panel": "#ffffff",
"--bg-navbar": "#454545",
"--qp-br-tl": "#333333",
"--qp-br-rd": "#535353",
"--qp-box-shadow-1": "#3b3b3b",
"--qp-box-shadow-2": "#4f4f4f",
"--bg-circuit": "#ddd",
"--br-circuit": "#454545",
"--br-primary": "#ffffff",
"--bg-primary-moz": "#454545e6",
"--bg-primary-chr": "#454545b3",
"--bg-tabs": "#8b8b8b",
"--bg-icons": "#7d7d7d",
"--bg-text": "#cacaca",
"--bg-secondary": "#bbbbbb",
"--canvas-stroke": "#eee",
"--canvas-fill": "#ffffff",
"--context-text": "#ffffff",
"--bg-toggle-btn-primary": "#42b983",
"--primary-btn-hov": "#3ca877",
"--btn-danger": "#dc5656",
"--btn-danger-darken": "#b03662",
"--disable": "#6c8b93",
"--cus-btn-hov--bg": "#ddd",
"--cus-btn-hov-text": "#000",
"--node": "#008000",
"--stroke": "#000",
"--fill": "#ffffff",
"--hover-and-sel": "#ffff20cc",
"--wire-draw": "#000",
"--wire-cnt": "#008000",
"--wire-pow": "#90ee90",
"--wire-sel": "#0000ff",
"--wire-lose": "#ff0000",
"--mini-map": "#008000",
"--mini-map-stroke": "#006400",
"--input-text": "#008000",
"--secondary-stroke": "#ff0000",
"--text": "#000",
"--wire-norm": "#000",
"--node-norm": "#008000",
"--splitter": "#000",
"--output-rect": "#0000ff",
"--touch-menu": "#A0937D",
},
};