The Material Design defines various colors. These are used in the visualization. It is recommended, if possible, to use the color values to declare a color. This ensures that contrast and design will match later. Special attention should be paid to this, as when switching from light to dark design, the text can become unreadable.
Tip: You can change the colors under Project Settings in the Visualization tab. This allows you to create an individual design.
These are all possible background colors of the visualization.
| Name | Value | Color | Text Color |
|---|---|---|---|
| Red | red | #D32F2F | #FFFFFF |
| Pink | pink | #C2185B | #FFFFFF |
| Purple | purple | #7B1FA2 | #FFFFFF |
| Deep Purple | deep_purple | #512DA8 | #FFFFFF |
| Indigo | indigo | #303F9F | #FFFFFF |
| Blue | blue | #1976D2 | #FFFFFF |
| Light Blue | light_blue | #0288D1 | #FFFFFF |
| Cyan | cyan | #0097A7 | #FFFFFF |
| Teal | teal | #00796B | #FFFFFF |
| Green | green | #388E3C | #FFFFFF |
| Light Green | light_green | #689F38 | #FFFFFF |
| Lime | lime | #AFB42B | #000000 |
| Yellow | yellow | #FBC02D | #000000 |
| Amber | amber | #FFA000 | #000000 |
| Orange | orange | #F57C00 | #000000 |
| Deep Orange | deep_orange | #E64A19 | #FFFFFF |
| Error | error | #B00020 | #FFFFFF |
These colors are recommended for texts and are used with the symbols on the floor plan to provide sufficient contrast.
| Name | Value | Color | Text Color |
|---|---|---|---|
| Red | red | #F44336 | #FFFFFF |
| Pink | pink | #E91E63 | #FFFFFF |
| Purple | purple | #9C27B0 | #FFFFFF |
| Deep Purple | deep_purple | #673AB7 | #FFFFFF |
| Indigo | indigo | #3F51B5 | #FFFFFF |
| Blue | blue | #2196F3 | #FFFFFF |
| Light Blue | light_blue | #03A9F4 | #000000 |
| Cyan | cyan | #00BCD4 | #000000 |
| Teal | teal | #009688 | #FFFFFF |
| Green | green | #4CAF50 | #000000 |
| Light Green | light_green | #8BC34A | #000000 |
| Lime | lime | #CDDC39 | #000000 |
| Yellow | yellow | #FFEB3B | #000000 |
| Amber | amber | #FFC107 | #000000 |
| Orange | orange | #FF9800 | #000000 |
| Deep Orange | deep_orange | #FF5722 | #FFFFFF |
| Brown | brown | #795548 | #FFFFFF |
| Gray | gray | #9E9E9E | #000000 |
| Blue Gray | blue_gray | #607D8B | #FFFFFF |
| Error | error | #B00020 | #FFFFFF |