saberbud/QDarkStyleSheet
1
0
Fork 0
mirror of https://github.com/ColinDuquesnoy/QDarkStyleSheet.git synced 2026-08-30 00:50:30 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add tables to docs

Browse Source
This commit is contained in:
Isabela Presedo-Floyd
2020-12-29 14:55:57 -08:00
committed by GitHub
parent 0d4757d921
commit 669f2ad8d0
1 changed files with 167 additions and 142 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/colorreference.md
+167 -142
View File
@@ -12,129 +12,160 @@ overlap. Depending on the colors, you may need more contrast to create a theme t
meets accessibility standards about contrast or color blindness.
### Gray
GRAY_0 `#000000`
GRAY_10 `#19232D`
GRAY_20 `#262E38`
GRAY_30 `#37414F`
GRAY_40 `#455364`
GRAY_50 `#54687A`
GRAY_60 `#60798B`
GRAY_70 `#788D9C`
GRAY_80 `#9DA9B5`
GRAY_90 `#CBCACA`
GRAY_100 `#D9D8D8`
GRAY_110 `#E1E1E1`
GRAY_120 `#EEEEEE`
GRAY_130 `#F5F5F5`
GRAY_140 `#FAFAFA`
GRAY_150 `#FFFFFF`
| System Name | Value | Sample |
| --- | --- | --- |
| B0 | `#000000` | ![ ](https://user-images.githubusercontent.com/50221806/103318619-db43f580-49e3-11eb-9747-fa8f49890d4c.png) |
| B10 | `#19232D` | ![ ]() |
| B20 | `#262E38` | ![ ]() |
| B30 | `#37414F` | ![ ]() |
| B40 | `#455364` | ![ ]() |
| B50 | `#54687A` | ![ ]() |
| B60 | `#60798B` | ![ ]() |
| B70 | `#788D9C` | ![ ]() |
| B80 | `#9DA9B5` | ![ ]() | 
| B90 | `#CBCACA` | ![ ]() |
| B100 | `#D9D8D8` | ![ ]() |
| B110 | `#E1E1E1` | ![ ]() |
| B120 | `#EEEEEE` | ![ ]() |
| B130 | `#F5F5F5` | ![ ]() |
| B140 | `#FAFAFA` | ![ ]() |
| B150 | `#FFFFFF` | ![ ]() |
### Blue
BLUE_0 `#000000`
BLUE_10 `#062647`
BLUE_20 `#26486B`
BLUE_30 `#375A7F`
BLUE_40 `#346792`
BLUE_50 `#1A72BB`
BLUE_60 `#057DCE`
BLUE_70 `#259AE9`
BLUE_80 `#37AEFE`
BLUE_90 `#73C7FF`
BLUE_100 `#9FD9FF`
BLUE_110 `#C2E3FA`
BLUE_120 `#CEEBFF`
BLUE_130 `#DAF0FF`
BLUE_140 `#F5FBFF`
BLUE_150 `##FFFFFF`
| System Name | Value | Sample |
| --- | --- | --- |
| B0 | `#000000` | |
| B10 | `#062647` | |
| B20 | `#26486B` | |
| B30 | `#375A7F` | |
| B40 | `#346792` | |
| B50 | `#1A72BB` | |
| B60 | `#057DCE` | |
| B70 | `#259AE9` | |
| B80 | `#37AEFE` | | 
| B90 | `#73C7FF` | |
| B100 | `#9FD9FF` | |
| B110 | `#C2E3FA` | |
| B120 | `#CEEBFF` | |
| B130 | `#DAF0FF` | |
| B140 | `#F5FBFF` | |
| B150 | `#FFFFFF` | |
### Green
GREEN_0 `#000000`
GREEN_10 `#064738`
GREEN_20 `#055C49`
GREEN_30 `#007A5E`
GREEN_40 `#008760`
GREEN_50 `#019D70`
GREEN_60 `#02BA85`
GREEN_70 `#20C997`
GREEN_80 `#44DEB0`
GREEN_90 `#3BEBB7`
GREEN_100 `#88F2D3`
GREEN_110 `#B0F5E1`
GREEN_120 `#D1FBEE`
GREEN_130 `#E4FFF7`
GREEN_140 `#F5FFFD`
GREEN_150 `#FFFFFF`
| System Name | Value | Sample |
| --- | --- | --- |
| B0 | `#000000` | |
| B10 | `#064738` | |
| B20 | `#055C49` | |
| B30 | `#007A5E` | |
| B40 | `#008760` | |
| B50 | `#019D70` | |
| B60 | `#02BA85` | |
| B70 | `#20C997` | |
| B80 | `#44DEB0` | | 
| B90 | `#3BEBB7` | |
| B100 | `#88F2D3` | |
| B110 | `#B0F5E1` | |
| B120 | `#D1FBEE` | |
| B130 | `#E4FFF7` | |
| B140 | `#F5FFFD` | |
| B150 | `#FFFFFF` | |
### Red
RED_0 `#000000`
RED_10 `#470606`
RED_20 `#760B0B`
RED_30 `#AF0F0F`
RED_40 `#D4140B`
RED_50 `#DE321F`
RED_60 `#E24232`
RED_70 `#E74C3C`
RED_80 `#F66657`
RED_90 `#F88478`
RED_100 `#FFACA4`
RED_110 `#FFC3BD`
RED_120 `#FEDDDA`
RED_130 `#FFEEEE`
RED_140 `#FFF5F5`
RED_150 `##FFFFFF`
| System Name | Value | Sample |
| --- | --- | --- |
| B0 | `#000000` | |
| B10 | `#470606` | |
| B20 | `#760B0B` | |
| B30 | `#AF0F0F` | |
| B40 | `#D4140B` | |
| B50 | `#DE321F` | |
| B60 | `#E24232` | |
| B70 | `#E74C3C` | |
| B80 | `#F66657` | | 
| B90 | `#F88478` | |
| B100 | `#FFACA4` | |
| B110 | `#FFC3BD` | |
| B120 | `#FEDDDA` | |
| B130 | `#FFEEEE` | |
| B140 | `#FFF5F5` | |
| B150 | `#FFFFFF` | |
### Orange
ORANGE_0 `#000000`
ORANGE_10 `#471D06`
ORANGE_20 `#692907`
ORANGE_30 `#AB3E00`
ORANGE_40 `#CE4B01`
ORANGE_50 `#E05E15`
ORANGE_60 `#E57004`
ORANGE_70 `#F37E12`
ORANGE_80 `#FF993B`
ORANGE_90 `#FFB950`
ORANGE_100 `#FFCF84`
ORANGE_110 `#FFDDA7`
ORANGE_120 `#FFEACA`
ORANGE_130 `#FFF3E2`
ORANGE_140 `#FFFBF5`
ORANGE_150 `##FFFFFF`
| System Name | Value | Sample |
| --- | --- | --- |
| B0 | `#000000` | |
| B10 | `#471D06` | |
| B20 | `#692907` | |
| B30 | `#AB3E00` | |
| B40 | `#CE4B01` | |
| B50 | `#E05E15` | |
| B60 | `#E57004` | |
| B70 | `#F37E12` | |
| B80 | `#FF993B` | | 
| B90 | `#FFB950` | |
| B100 | `#FFCF84` | |
| B110 | `#FFC3BD` | |
| B120 | `#FFEACA` | |
| B130 | `#FFF3E2` | |
| B140 | `#FFFBF5` | |
| B150 | `#FFFFFF` | |
## Default Dark Mode
### Background
BACKGROUND_1 = 'GRAY_10' `#19232D`
BACKGROUND_2 = 'GRAY_20' `#262E38`
BACKGROUND_3 = 'GRAY_40' `#455364`
BACKGROUND_4 = 'GRAY_60' `#60798B`
BACKGROUND_5 = 'GRAY_60' `#60798B`
| Palette Name | System Name | Value | Sample |
| --- | --- | --- | --- |
| BACKGROUND_1 | B10 | `#19232D` | |
| BACKGROUND_2 | B20 | `#262E38` | |
| BACKGROUND_3 | B40 | `#455364` | |
| BACKGROUND_4 | B60 | `#60798B` | |
| BACKGROUND_5 | B60 | `#60798B` | |
### Text
TEXT_1 = 'GRAY_150' `#FFFFFF`
TEXT_2 = 'GRAY_140' `#FAFAFA`
TEXT_3 = 'GRAY_120' `#EEEEEE`
TEXT_4 = 'GRAY_100' `#D9D8D8`
| Palette Name | System Name | Value | Sample |
| --- | --- | --- | --- |
| TEXT_1 | B150 | `#FFFFFF` | |
| TEXT_2 | B140 | `#FAFAFA` | |
| TEXT_3 | B120 | `#EEEEEE` | |
| TEXT_4 | B100 | `#D9D8D8` | |
### Inverse Text
INVERSE_TEXT_1 = 'GRAY_150' `#FFFFFF`
INVERSE_TEXT_2 = 'GRAY_140' `#FAFAFA`
INVERSE_TEXT_3 = 'GRAY_120' `#EEEEEE`
INVERSE_TEXT_4 = 'GRAY_100' `#D9D8D8`
| Palette Name | System Name | Value | Sample |
| --- | --- | --- | --- |
| INVERSE_TEXT_1 | B150 | `#FFFFFF` | |
| INVERSE_TEXT_2 | B140 | `#FAFAFA` | |
| INVERSE_TEXT_3 | B120 | `#EEEEEE` | |
| INVERSE_TEXT_4 | B100 | `#D9D8D8` | |
### Accent
ACCENT_1 = 'BLUE_50' `#1A72BB`
ACCENT_2 = 'BLUE_70' `##259AE9`
ACCENT_3 = 'BLUE_90' `#73C7FF`
ACCENT_4 = 'BLUE_110' `#C2E3FA`
| Palette Name | System Name | Value | Sample |
| --- | --- | --- | --- |
| ACCENT_1 | B50 | `#1A72BB` | |
| ACCENT_2 | B70 | `#259AE9` | |
| ACCENT_3 | B90 | `#73C7FF` | |
| ACCENT_4 | B110 | `#C2E3FA` | |
### Border
BORDER_1 = 'GRAY_40' `#455364`
BORDER_2 = 'GRAY_50' `#54687A`
BORDER_3 = 'GRAY_60' `#60798B`
BORDER_4 = 'GRAY_70' `#788D9C`
<!--Below colors may belong only to Spyder?-->
| Palette Name | System Name | Value | Sample |
| --- | --- | --- | --- |
| BORDER_1 | B40 | `#455364` | |
| BORDER_2 | B50 | `#54687A` | |
| BORDER_3 | B60 | `#60798B` | |
| BORDER_4 | B70 | `#788D9C` | |
### Feedback
SUCCESS_1 = 'GREEN_40' `#008760`
SUCCESS_2 = 'GREEN_70' `#20C997`
SUCCESS_3 = 'GREEN_110' `#B0F5E1`
ERROR_1 = 'RED_40' `#D4140B`
ERROR_2 = 'RED_70' `#E74C3C`
ERROR_3 = 'RED_110' `#FFC3BD`
WARN_1 = 'ORANGE_40' `#CE4B01`
WARN_2 = 'ORANGE_70' `#F37E12`
WARN_3 = 'ORANGE_110' `#FFDDA7`
| Palette Name | System Name | Value | Sample |
| --- | --- | --- | --- |
| SUCCESS_1 | B40 | `#008760` | |
| SUCCESS_2 | B70 | `#20C997` | |
| SUCCESS_3 | B110 | `#B0F5E1` | |
| ERROR_1 | B40 | `#D4140B` | |
| ERROR_2 | B70 | `#E74C3C` | |
| ERROR_3 | B110 | `#FFC3BD` | |
| WARN_1 | B40 | `#CE4B01` | |
| WARN_2 | B70 | `#F37E12` | |
| WARN_3 | B110 | `#FFDDA7` | |
### Icon
ICON_1 = 'GRAY_140' `#FAFAFA`
ICON_2 = 'BLUE_70' `#259AE9`
@@ -142,31 +173,38 @@ ICON_3 = 'GREEN_70' `#20C997`
ICON_4 = 'RED_70' `#E74C3C`
ICON_5 = 'ORANGE_70' `#F37E12`
ICON_6 = 'GRAY_30' `#37414F`
| Palette Name | System Name | Value | Sample |
| --- | --- | --- | --- |
| ICON_1 | B140 | `#FAFAFA` | |
| ICON_2 | B70 | `#259AE9` | |
| ICON_3 | B70 | `#20C997` | |
| ICON_4 | B70 | `#E74C3C` | |
| ICON_5 | B70 | `#F37E12` | |
| ICON_6 | B30 | `#37414F` | |
### Highlight
HIGHLIGHT_1 = 'GRAY_50' #90% `#54687A` `rgba(84,104,122,0.9)`
HIGHLIGHT_2 = 'GRAY_60' #90% `#60798B` `rgba(96,121,139,0.9)`
HIGHLIGHT_3 = 'GRAY_70' #90% `#788D9C` `rgba(120,141,156,0.9)`
HIGHLIGHT_4 = 'GRAY_80' #90% `#9DA9B5` `rgba(157,169,181,0.9)`
| Palette Name | System Name | Value | Sample |
| --- | --- | --- | --- |
| HIGHLIGHT_1 | B50 | `#54687A` | |
| HIGHLIGHT_2 | B60 | `#60798B` | |
| HIGHLIGHT_3 | B70 | `#788D9C` | |
| HIGHLIGHT_4 | B80 | `#9DA9B5` | |
### Find
FIND_1 = 'BLUE_50' #90% `#1A72BB` `rgba(26,114,187,0.9)`
FIND_2 = 'BLUE_60' #90% `#057DCE` `rgba(5,125,206,0.9)`
FIND_3 = 'BLUE_70' #90% `#259AE9` `rgba(37,154,233,0.9)`
FIND_4 = 'BLUE_80' #90% `#37AEFE` `rgba(55,174,254,0.9)`
### Group
GROUP_1 `#E11C1C`
GROUP_2 `#FF8A00`
GROUP_3 `#88BA00`
GROUP_4 `#2DB500`
GROUP_5 `#3FC6F0`
GROUP_6 `#107EEC`
GROUP_7 `#5C47E0`
GROUP_8 `#7F27C5`
GROUP_9 `#C88AFA`
GROUP_10 `#AF2294`
GROUP_11 `#DB4D8E`
GROUP_12 `#38D4A4`
| Palette Name | System Name | Value | Sample |
| --- | --- | --- | --- |
| FIND_1 | B50 | `#1A72BB` | |
| FIND_2 | B60 | `#057DCE` | |
| FIND_3 | B70 | `#259AE9` | |
| FIND_4 | B80 | `#37AEFE` | |
## Deafult Light Mode
## Default Light Mode
### Background
BACKGROUND_1 = 'GRAY_140' `#FAFAFA`
BACKGROUND_2 = 'GRAY_120' `#EEEEEE`
@@ -221,16 +259,3 @@ FIND_1 = 'BLUE_80' #90% `#37AEFE` `rgba(55,174,254,0.9)`
FIND_2 = 'BLUE_70' #90% `#259AE9` `rgba(37,154,233,0.9)`
FIND_3 = 'BLUE_60' #90% `#057DCE` `rgba(5,125,206,0.9)`
FIND_4 = 'BLUE_50' #90% `#1A72BB` `rgba(26,114,187,0.9)`
### Group
GROUP_1 `#FF6700`
GROUP_2 `#FFB000`
GROUP_3 `#FFE600`
GROUP_4 `#7FDD05`
GROUP_5 `#00A585`
GROUP_6 `#22BCF2`
GROUP_7 `#1256CC`
GROUP_8 `#803AD0`
GROUP_9 `#B568F2`
GROUP_10 `#CC2782`
GROUP_11 `#FF71BF`
GROUP_12 `#7EE8C7`