Mathijs/Home_assistant_Thema_MRL
1
0
Fork 0
mirror of https://github.com/Mathijs0/home_assistant_thema_mrl.git synced 2024-05-20 07:07:45 +02:00
Code Issues Packages Projects Releases Wiki Activity
Home_assistant_Thema_MRL/themes/mrl.yaml
Mathijs 152042ef47
Update mrl.yaml
2024-03-16 23:38:21 +01:00

342 lines
12 KiB
YAML
Raw Permalink Blame History

####################### LATTE #######################
MRL light:
# Colors
text: "#4c4f69"
subtext1: "#5c5f77"
subtext0: "#6c6f85"
overlay2: "#7c7f93"
overlay1: "#8c8fa1"
overlay0: "#9ca0b0"
surface2: "#acb0be"
surface1: "#bcc0cc"
surface0: "#ccd0da"
base: "#eff1f5"
mantle: "#e6e9ef"
crust: "#dce0e8"
rosewater: "#dc8a78"
flamingo: "#dd7878"
pink: "#ea76cb"
mauve: "#8839ef"
red: "#d20f39"
maroon: "#e64553"
peach: "#fe640b"
yellow: "#df8e1d"
green: "#40a02b"
teal: "#179299"
sky: "#04a5e5"
sapphire: "#209fb5"
blue: "#1e66f5"
lavender: "#7287fd"
###########################
# Header
app-header-background-color: var(--mantle)
app-header-text-color: var(--text)
# Main Interface colors
primary-color: var(--blue)
light-primary-color: var(--primary-color)
primary-background-color: var(--mantle)
secondary-background-color: var(--mantle)
accent-color: var(--yellow)
# Text
primary-text-color: var(--text)
secondary-text-color: var(--subtext1)
text-primary-color: var(--text)
divider-color: var(--base)
disabled-text-color: var(--overlay0)
text-accent-color: var(--text)
# Sidebar
sidebar-background-color: var(--crust)
sidebar-selected-background-color: var(--primary-background-color)
sidebar-icon-color: var(--subtext0)
sidebar-text-color: var(--subtext0)
sidebar-selected-icon-color: var(--sky)
sidebar-selected-text-color: var(--sky)
# Buttons
paper-item-icon-color: var(--subtext0)
paper-item-icon-active-color: var(--primary-color)
# States and Badges
state-icon-color: var(--lavender)
state-icon-active-color: var(--primary-color)
state-icon-unavailable-color: var(--disabled-text-color)
# Sliders
paper-slider-knob-color: var(--blue)
paper-slider-knob-start-color: var(--paper-slider-knob-color)
paper-slider-pin-color: var(--paper-slider-knob-color)
paper-slider-active-color: var(--paper-slider-knob-color)
paper-slider-secondary-color: var(--blue)
# Labels
label-badge-background-color: var(--surface0)
label-badge-text-color: var(--text)
label-badge-red: var(--red)
label-badge-green: var(--green)
label-badge-blue: var(--blue)
label-badge-yellow: var(--yellow)
label-badge-gray: var(--overlay0)
# Cards
card-background-color: var(--base)
ha-card-background: var(--card-background-color)
ha-card-border-radius: "15px"
ha-card-box-shadow: "inset 0px 0px 0px 0px var(--divider-color)"
paper-dialog-background-color: var(--overlay0)
paper-listbox-background-color: var(--overlay0)
paper-card-background-color: var(--card-background-color)
# Switches
switch-checked-button-color: var(--green)
switch-checked-track-color: var(--surface0)
switch-unchecked-button-color: rgb(--overlay0)
switch-unchecked-track-color: rgb(--surface0)
# Toggles
paper-toggle-button-checked-button-color: var(--switch-checked-button-color)
paper-toggle-button-checked-bar-color: var(--switch-checked-track-color)
paper-toggle-button-unchecked-button-color: var(--switch-unchecked-button-color)
paper-toggle-button-unchecked-bar-color: var(--switch-unchecked-track-color)
# Table
table-row-background-color: var(--primary-background-color)
table-row-alternative-background-color: var(--secondary-background-color)
data-table-background-color: var(--primary-background-color)
mdc-checkbox-unchecked-color: var(--overlay0)
# Dropdowns
material-background-color: var(--primary-background-color)
material-secondary-background-color: var(--primary-background-color)
mdc-theme-surface: var(--primary-background-color)
# Pre/Code
markdown-code-background-color: var(--surface0)
# Checkboxes
mdc-select-fill-color: var(--surface0)
mdc-select-ink-color: var(--primary-text-color)
mdc-select-label-ink-color: var(--subtext1)
mdc-select-idle-line-color: var(--primary-text-color)
mdc-select-dropdown-icon-color: var(--secondary-text-color)
mdc-select-hover-line-color: var(--accent-color)
# Input
input-fill-color: var(--secondary-background-color)
input-dropdown-icon-color: var(--secondary-text-color)
input-ink-color: var(--primary-text-color)
input-label-ink-color: var(--secondary-text-color)
input-idle-line-color: var(--primary-text-color)
input-hover-line-color: var(--accent-color)
# Toast
paper-toast-background-color: var(--overlay0)
# Colors
error-color: var(--red)
warning-color: var(--yellow)
success-color: var(--green)
info-color: var(--blue)
state-on-color: var(--green)
state-off-color: var(--red)
#Animated Weather Card:
weather-icon-clear-night: url("/hacsfiles/themes/animated-weather-card/icons/clear-night.svg")
weather-icon-cloudy: url("/hacsfiles/themes/animated-weather-card/icons/cloudy.svg")
weather-icon-fog: url("/hacsfiles/themes/animated-weather-card/icons/cloudy.svg")
weather-icon-lightning: url("/hacsfiles/themes/animated-weather-card/icons/lightning.svg")
weather-icon-lightning-rainy: url("/hacsfiles/themes/animated-weather-card/icons/lightning.svg")
weather-icon-partlycloudy: url("/hacsfiles/themes/animated-weather-card/icons/partlycloudy.svg")
weather-icon-pouring: url("/hacsfiles/themes/animated-weather-card/icons/pouring.svg")
weather-icon-rainy: url("/hacsfiles/themes/animated-weather-card/icons/rainy.svg")
weather-icon-hail: url("/hacsfiles/themes/animated-weather-card/icons/hail.svg")
weather-icon-snowy: url("/hacsfiles/themes/animated-weather-card/icons/snowy.svg")
weather-icon-snowy-rainy: url("/hacsfiles/themes/animated-weather-card/icons/hail.svg")
weather-icon-sunny: url("/hacsfiles/themes/animated-weather-card/icons/sunny.svg")
weather-icon-windy: url("/hacsfiles/themes/animated-weather-card/icons/cloudy.svg")
weather-icon-windy-variant: url("/hacsfiles/themes/animated-weather-card/icons/partlycloudy.svg")
####################### MRL dark ######################
MRL dark:
# Colors
text: "#c6d0f5"
subtext1: "#b5bfe2"
subtext0: "#a5adce"
overlay2: "#949cbb"
overlay1: "#838ba7"
overlay0: "#737994"
surface2: "#626880"
surface1: "#51576d"
surface0: "#414559"
base: "#303446"
mantle: "#292c3c" #kop
crust: "#232634" # zij bar
rosewater: "#f2d5cf"
flamingo: "#eebebe"
pink: "#f4b8e4"
mauve: "#ca9ee6"
red: "#e78284"
maroon: "#ea999c"
peach: "#ef9f76"
yellow: "#e5c890"
green: "#a6d189"
teal: "#81c8be"
sky: "#99d1db"
sapphire: "#85c1dc"
blue: "#8caaee"
lavender: "#babbf1"
###########################
# Header
app-header-background-color: var(--mantle)
app-header-text-color: var(--text)
# Main Interface colors
primary-color: var(--blue)
light-primary-color: var(--primary-color)
accent-color: var(--yellow)
primary-background-color: var(--base)
secondary-background-color: var(--base)
# Text
primary-text-color: var(--text)
secondary-text-color: var(--subtext1)
text-primary-color: var(--text)
divider-color: var(--base)
disabled-text-color: var(--overlay0)
text-accent-color: var(--base)
# Sidebar
sidebar-background-color: var(--crust)
sidebar-selected-background-color: var(--primary-background-color)
sidebar-icon-color: var(--subtext0)
sidebar-text-color: var(--subtext0)
sidebar-selected-icon-color: var(--sky)
sidebar-selected-text-color: var(--sky)
# Buttons
paper-item-icon-color: var(--subtext0)
paper-item-icon-active-color: var(--primary-color)
# States and Badges
state-icon-color: var(--lavender)
state-icon-active-color: var(--primary-color)
state-icon-unavailable-color: var(--disabled-text-color)
# Sliders
paper-slider-knob-color: var(--blue)
paper-slider-knob-start-color: var(--paper-slider-knob-color)
paper-slider-pin-color: var(--paper-slider-knob-color)
paper-slider-active-color: var(--paper-slider-knob-color)
paper-slider-secondary-color: var(--blue)
# Labels
label-badge-background-color: var(--surface0)
label-badge-text-color: var(--text)
label-badge-red: var(--red)
label-badge-green: var(--sapphire)
label-badge-blue: var(--blue)
label-badge-yellow: var(--yellow)
label-badge-gray: var(--overlay0)
# Cards
card-background-color: var(--surface0)
ha-card-background: var(--card-background-color)
ha-card-border-radius: "15px"
ha-card-box-shadow: "inset 0px 0px 0px 0px var(--divider-color)"
paper-dialog-background-color: var(--overlay0)
paper-listbox-background-color: var(--overlay0)
paper-card-background-color: var(--card-background-color)
# Switches
switch-checked-button-color: var(--sapphire)
switch-checked-track-color: var(--surface2)
switch-unchecked-button-color: rgb(--overlay0)
switch-unchecked-track-color: rgb(--surface0)
# Toggles
paper-toggle-button-checked-button-color: var(--switch-checked-button-color)
paper-toggle-button-checked-bar-color: var(--switch-checked-track-color)
paper-toggle-button-unchecked-button-color: var(--switch-unchecked-button-color)
paper-toggle-button-unchecked-bar-color: var(--switch-unchecked-track-color)
# Table
table-row-background-color: var(--primary-background-color)
table-row-alternative-background-color: var(--secondary-background-color)
data-table-background-color: var(--primary-background-color)
mdc-checkbox-unchecked-color: var(--overlay0)
# Dropdowns
material-background-color: var(--primary-background-color)
material-secondary-background-color: var(--primary-background-color)
mdc-theme-surface: var(--primary-background-color)
# Pre/Code
markdown-code-background-color: var(--surface0)
# Checkboxes
mdc-select-fill-color: var(--surface0)
mdc-select-ink-color: var(--primary-text-color)
mdc-select-label-ink-color: var(--subtext1)
mdc-select-idle-line-color: var(--primary-text-color)
mdc-select-dropdown-icon-color: var(--secondary-text-color)
mdc-select-hover-line-color: var(--accent-color)
# Input
input-fill-color: var(--secondary-background-color)
input-dropdown-icon-color: var(--secondary-text-color)
input-ink-color: var(--primary-text-color)
input-label-ink-color: var(--secondary-text-color)
input-idle-line-color: var(--primary-text-color)
input-hover-line-color: var(--accent-color)
# Toast
paper-toast-background-color: var(--overlay0)
# Colors
error-color: var(--red)
warning-color: var(--yellow)
success-color: var(--green)
info-color: var(--blue)
state-on-color: var(--green)
state-off-color: var(--red)
#Animated Weather Card:
weather-icon-clear-night: url("/hacsfiles/themes/animated-weather-card/icons/clear-night.svg")
weather-icon-cloudy: url("/hacsfiles/themes/animated-weather-card/icons/cloudy.svg")
weather-icon-fog: url("/hacsfiles/themes/animated-weather-card/icons/cloudy.svg")
weather-icon-lightning: url("/hacsfiles/themes/animated-weather-card/icons/lightning.svg")
weather-icon-lightning-rainy: url("/hacsfiles/themes/animated-weather-card/icons/lightning.svg")
weather-icon-partlycloudy: url("/hacsfiles/themes/animated-weather-card/icons/partlycloudy.svg")
weather-icon-pouring: url("/hacsfiles/themes/animated-weather-card/icons/pouring.svg")
weather-icon-rainy: url("/hacsfiles/themes/animated-weather-card/icons/rainy.svg")
weather-icon-hail: url("/hacsfiles/themes/animated-weather-card/icons/hail.svg")
weather-icon-snowy: url("/hacsfiles/themes/animated-weather-card/icons/snowy.svg")
weather-icon-snowy-rainy: url("/hacsfiles/themes/animated-weather-card/icons/hail.svg")
weather-icon-sunny: url("/hacsfiles/themes/animated-weather-card/icons/sunny.svg")
weather-icon-windy: url("/hacsfiles/themes/animated-weather-card/icons/cloudy.svg")
weather-icon-windy-variant: url("/hacsfiles/themes/animated-weather-card/icons/partlycloudy.svg")
Reference in a new issue View git blame Copy permalink