Created
August 16, 2019 15:41
-
-
Save iantrich/6601fcb66d5530c0ff839b58278a75fa to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| transparent: | |
| # 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 | |
| ha-card-border-radius: '20px' | |
| ha-card-background: 'rgba(150, 150, 150, 0.1)' | |
| # 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: 'rgba(150, 150, 150, 0.1)' # 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 | |
| label-badge-background: 'rgba(255, 255, 255, 0.1)' | |
| # 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' |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment