diff --git a/.gitignore b/.gitignore index 2697d35..fda27e1 100644 --- a/.gitignore +++ b/.gitignore @@ -18,6 +18,7 @@ *.png home-assistant_v2* custom_components +node-red # Ensure these YAML files are ignored, otherwise your secret data/credentials will leak. diff --git a/themes/carbon-green.yaml b/themes/carbon-green.yaml new file mode 100644 index 0000000..1cec131 --- /dev/null +++ b/themes/carbon-green.yaml @@ -0,0 +1,76 @@ +carbon-green: + #Color List + make-light-carbon: "#93A5AB" + make-carbon: "#111924" + make-grey: "#DEE5E7" + make-green: "#C2DD08" + make-blue: "#00A3DA" + make-red: "#EC5D57" + make-yellow: "#FCF933" + make-orange: "#E49D64" + make-white: "#FFFFFF" + make-disable: "#bdbdbd" + light-primary-color: "var(make-light-carbon)" + background-color: "var(--make-grey)" + dark-primary-color: "var(-make-carbon)" + #Main Colors + primary-background-color: "var(--make-light-carbon)" #Background color settings + secondary-background-color: "var(--make-grey)" #Background tabs + primary-text-color: "var(--make-carbon)" #Primary Text + secondary-text-color: "var(--make-green)" #sub text etc. + disabled-text-color: "var(--make-disable)" #Deactivated Text + divider-color: "var(--make-green)" #Divider Linies + primary-color: "var(--make-carbon)" #Head of HA + #Labels + label-badge-red: "var(--make-red)" + label-badge-blue: "var(--make-blue)" + label-badge-green: "var(--make-green)" + label-badge-yellow: "var(--make-yellow)" + label-badge-grey: "var(--make-grey)" + label-badge-text-color: "var(--make-carbon)" #Text color sensors + label-badge-background-color: "var(--make-grey)" #Background sensors + #Google Loading + google-red-500: "var(--make-red)" + google-blue-500: "var(--make-blue)" + google-green-500: "var(--make-green)" + google-yellow-500: "var(--make-yellow)" + #Frontend + paper-green-400: "var(--make-green)" + paper-blue-400: "var(--make-blue)" + paper-orange-400: "var(--make-orange)" + paper-grey-50: "var(--make-grey)" + paper-grey-200: "var(--make-green)" + paper-item-icon-color: "var(--make-grey)" #Color Icon off + paper-item-icon-active-color: "var(--make-green)" #Color Icon on + paper-button-ink-color: "var(--make-carbon)" #Color Button selected + paper-button-color: "var(--make-red)" + paper-toggle-button-checked-ink-color: "var(--make-green)" + paper-toggle-button-checked-button-color: "var(--make-green)" + paper-toggle-button-checked-bar-color: "var(--make-green)" + paper-toggle-button-unchecked-button-color: "var(--make-grey)" + paper-toggle-button-unchecked-bar-color: "var(--make-grey)" + paper-toggle-button-unchecked-ink-color: "var(--make-grey)" + paper-slider-knob-color: "var(--make-carbon)" #Slider dot on + paper-slider-knob-start-color: "var(--make-carbon)" #Slider dot off + paper-slider-pin-color: "var(--make-red)" # + paper-slider-active-color: "var(--make-carbon)" #Slider line active + paper-slider-secondary-color: "var(--make-red)" # + paper-slider-container-color: "var(--make-light-carbon)" #Slider line inactive + paper-listbox-color: "var(--make-carbon)" #Text Dorpdown box + paper-listbox-background-color: "var(--make-grey)" #Background of Listen + paper-card-background-color: "var(--make-light-carbon)" #Background from cards in tabs + paper-card-header-color: "var(--make-carbon)" #Headline Color of tabs + paper-dialog-background-color: "var(--make-grey)" #Color Dialog Box + paper-item-selected_-_background-color: "var(--make-green)" #Selected Option in Dropdown + paper-tabs-selection-bar-color: "var(--make-red)" # + table-row-background-color: "var(--make-grey)" #Background color table + table-row-alternative-background-color: "var(--make-gery)" #second color table + #Font + primary-font-family: "Gill Sans" + paper-font-common-base_-_font-family: "var(--primary-font-family)" + paper-font-common-code_-_font-family: "var(--primary-font-family)" + paper-font-body1_-_font-family: "var(--primary-font-family)" + paper-font-subhead_-_font-family: "var(--primary-font-family)" + paper-font-headline_-_font-family: "var(--primary-font-family)" + paper-font-caption_-_font-family: "var(--primary-font-family)" + paper-font-title_-_font-family: "var(--primary-font-family)" diff --git a/themes/darkcyan.yaml b/themes/darkcyan.yaml new file mode 100644 index 0000000..7cb7115 --- /dev/null +++ b/themes/darkcyan.yaml @@ -0,0 +1,31 @@ +darkcyan: + # Main colors that can be changed + primary-color: "#00bcd4" + disabled-text-color: "#545454" + divider-color: "rgba(255, 255, 255, 0.12)" + paper-card-background-color: "#4e4e4e" + paper-grey-200: "#191919" + paper-item-icon-color: "#d3d3d3" + paper-listbox-background-color: "#202020" + paper-listbox-color: "#FFFFFF" + primary-background-color: "#303030" + primary-text-color: "#cfcfcf" + secondary-background-color: "#2b2b2b" + secondary-text-color: "#04a7bc" + # Colors based on variables, see above + label-badge-background-color: "var(--secondary-background-color)" + label-badge-text-color: "var(--text-primary-color)" + paper-card-header-color: "#var(--paper-item-icon-color)" + paper-grey-50: "var(--primary-text-color)" + paper-item-icon-active-color: "var(--primary-color)" + paper-item-icon_-_color: "var(--primary-text-color)" + paper-slider-active-color: "var(--primary-color)" + paper-slider-knob-color: "var(--primary-color)" + paper-slider-knob-start-color: "var(--primary-color)" + paper-slider-pin-color: "var(--primary-color)" + paper-slider-secondary-color: "var(--light-primary-color)" + paper-toggle-button-checked-ink-color: "var(--dark-primary-color)" + paper-toggle-button-checked-button-color: "var(--primary-color)" + paper-toggle-button-checked-bar-color: "var(--light-primary-color)" + paper-toggle-button-unchecked-bar-color: "var(--primary-text-color)" + \ No newline at end of file diff --git a/themes/darkred.yaml b/themes/darkred.yaml new file mode 100644 index 0000000..66c0bd0 --- /dev/null +++ b/themes/darkred.yaml @@ -0,0 +1,33 @@ +darkred: + # Main colors that can be changed + dark-primary-color: "#c66900" + disabled-text-color: "#545454" + divider-color: "rgba(255, 255, 255, 0.12)" + light-primary-color: "#e06c6c" + paper-card-background-color: "#1d1d1d" + paper-grey-200: "#191919" + paper-item-icon-color: "#d3d3d3" + paper-listbox-background-color: "#202020" + primary-background-color: "#303030" + primary-color: "#d32f2f" + primary-text-color: "#cfcfcf" + secondary-background-color: "#131313" + sidebar-text_-_background: "#62717b" + # Colors based on variables, see above + paper-card-header-color: "var(--paper-item-icon-color)" + paper-item-icon-active-color: "var(--primary-color)" + paper-item-icon_-_color: "var(--primary-text-color)" + paper-listbox-color: "var(--primary-text-color)" + paper-grey-50: "var(--primary-text-color)" + paper-slider-active-color: "var(--primary-color)" + paper-slider-knob-color: "var(--primary-color)" + paper-slider-knob-start-color: "var(--primary-color)" + paper-slider-pin-color: "var(--primary-color)" + paper-slider-secondary-color: "var(--light-primary-color)" + paper-toggle-button-checked-ink-color: "var(--dark-primary-color)" + paper-toggle-button-checked-button-color: "var(--primary-color)" + paper-toggle-button-checked-bar-color: "var(--light-primary-color)" + paper-toggle-button-unchecked-bar-color: "var(--primary-text-color)" + secondary-text-color: "var(--primary-color)" + table-row-background-color: "var(--paper-card-background-color)" + table-row-alternative-background-color: "var(--sidebar-text_-_background)" diff --git a/themes/midnight.yaml b/themes/midnight.yaml new file mode 100644 index 0000000..7112ed3 --- /dev/null +++ b/themes/midnight.yaml @@ -0,0 +1,65 @@ +midnight: + # Main colors + primary-color: '#5294E2' # Header + accent-color: '#E45E65' # Accent color + dark-primary-color: 'var(--accent-color)' # Hyperlinks + light-primary-color: 'var(--accent-color)' # Horizontal line in about + + # Text colors + primary-text-color: '#FFFFFF' # Primary text colour, here is referencing dark-primary-color + text-primary-color: 'var(--primary-text-color)' # Primary text colour + secondary-text-color: '#5294E2' # For secondary titles in more info boxes etc. + disabled-text-color: '#7F848E' # Disabled text colour + label-badge-border-color: 'green' # Label badge border, just a reference value + + # Background colors + primary-background-color: '#383C45' # Settings background + secondary-background-color: '#383C45' # Main card UI background + divider-color: 'rgba(0, 0, 0, .12)' # Divider + + # Table rows + table-row-background-color: '#353840' # Table row + table-row-alternative-background-color: '#3E424B' # Table row alternative + + # Nav Menu + paper-listbox-color: 'var(--primary-color)' # Navigation menu selection hoover + paper-listbox-background-color: '#2E333A' # Navigation menu background + paper-grey-50: 'var(--primary-text-color)' + paper-grey-200: '#414A59' # Navigation menu selection + + # Paper card + paper-card-header-color: 'var(--accent-color)' # Card header text colour + paper-card-background-color: '#434954' # Card background colour + paper-dialog-background-color: '#434954' # Card dialog background colour + paper-item-icon-color: 'var(--primary-text-color)' # Icon color + paper-item-icon-active-color: '#F9C536' # Icon color active + paper-item-icon_-_color: 'green' + paper-item-selected_-_background-color: '#434954' # Popup item select + paper-tabs-selection-bar-color: 'green' + + # Labels + label-badge-red: 'var(--accent-color)' # References the brand colour label badge border + label-badge-text-color: 'var(--primary-text-color)' # Now same as label badge border but that's a matter of taste + label-badge-background-color: '#2E333A' # Same, but can also be set to transparent here + + # Switches + paper-toggle-button-checked-button-color: 'var(--accent-color)' + paper-toggle-button-checked-bar-color: 'var(--accent-color)' + paper-toggle-button-checked-ink-color: 'var(--accent-color)' + paper-toggle-button-unchecked-button-color: 'var(--disabled-text-color)' + paper-toggle-button-unchecked-bar-color: 'var(--disabled-text-color)' + paper-toggle-button-unchecked-ink-color: 'var(--disabled-text-color)' + + # Sliders + paper-slider-knob-color: 'var(--accent-color)' + paper-slider-knob-start-color: 'var(--accent-color)' + paper-slider-pin-color: 'var(--accent-color)' + paper-slider-active-color: 'var(--accent-color)' + paper-slider-container-color: 'linear-gradient(var(--primary-background-color), var(--secondary-background-color)) no-repeat' + paper-slider-secondary-color: 'var(--secondary-background-color)' + paper-slider-disabled-active-color: 'var(--disabled-text-color)' + paper-slider-disabled-secondary-color: 'var(--disabled-text-color)' + + # Google colors + google-red-500: '#E45E65' + google-green-500: '#39E949' \ No newline at end of file