MediaWiki:Gadget-Palette/table
Jump to navigation
Jump to search
The Palette variables shown below are defined in MediaWiki:Gadget-Palette.css. To request a new variable to be added, do so here using this format: <name> <light mode hex code> <dark mode hex code>.
| Variable name | Light mode | Dark mode | Use as a background colour? | Use as a text colour? |
|---|---|---|---|---|
--wikt-palette-white |
#ffffff | #101418 | Light mode: WCAG 16.13 (AAA), APCA 103.10 (R4) Dark mode: WCAG 15.64 (AAA), APCA -94.69 (R2) |
Light mode: WCAG 1.00 (FAIL), APCA 0.00 (R0) Dark mode: WCAG 1.00 (FAIL), APCA 0.00 (R0) |
--wikt-palette-black |
#202122 | #eaecf0 | Light mode: WCAG 1.00 (FAIL), APCA 0.00 (R0) Dark mode: WCAG 1.00 (FAIL), APCA 0.00 (R0) |
Light mode: WCAG 16.13 (AAA), APCA 103.10 (R4) Dark mode: WCAG 15.64 (AAA), APCA -94.69 (R2) |
--wikt-palette-beige |
#fffbf2 | #2f1f10 | Light mode: WCAG 15.62 (AAA), APCA 100.84 (R4) Dark mode: WCAG 13.41 (AAA), APCA -92.86 (R2) |
Light mode: WCAG 1.03 (FAIL), APCA 0.00 (R0) Dark mode: WCAG 1.17 (FAIL), APCA 0.00 (R0) |
--wikt-palette-grey |
#9e9e9e | #4e4e4e | Light mode: WCAG 6.02 (AA), APCA 49.01 (R0) Dark mode: WCAG 7.04 (AAA), APCA -80.85 (R0) |
Light mode: WCAG 2.68 (FAIL), APCA 52.07 (R0) Dark mode: WCAG 2.22 (FAIL), APCA -12.74 (R0) |
--wikt-palette-lightgrey |
#cccccc | #3d3d3d | Light mode: WCAG 10.04 (AAA), APCA 73.56 (R0) Dark mode: WCAG 9.18 (AAA), APCA -86.57 (R1) |
Light mode: WCAG 1.61 (FAIL), APCA 27.29 (R0) Dark mode: WCAG 1.70 (FAIL), APCA 0.00 (R0) |
--wikt-palette-lightergrey |
#eeeeee | #242424 | Light mode: WCAG 13.90 (AAA), APCA 93.00 (R2) Dark mode: WCAG 13.12 (AAA), APCA -92.65 (R2) |
Light mode: WCAG 1.16 (FAIL), APCA 7.57 (R0) Dark mode: WCAG 1.19 (FAIL), APCA 0.00 (R0) |
--wikt-palette-cream |
#f8f8f0 | #2c2c21 | Light mode: WCAG 15.11 (AAA), APCA 98.58 (R3) Dark mode: WCAG 11.92 (AAA), APCA -91.29 (R2) |
Light mode: WCAG 1.07 (FAIL), APCA 0.00 (R0) Dark mode: WCAG 1.31 (FAIL), APCA 0.00 (R0) |
--wikt-palette-pink |
#ffe0f0 | #612042 | Light mode: WCAG 13.19 (AAA), APCA 89.64 (R1) Dark mode: WCAG 9.90 (AAA), APCA -87.49 (R1) |
Light mode: WCAG 1.22 (FAIL), APCA 10.98 (R0) Dark mode: WCAG 1.58 (FAIL), APCA 0.00 (R0) |
--wikt-palette-peach |
#e4d4c0 | #58230a | Light mode: WCAG 11.12 (AAA), APCA 79.30 (R0) Dark mode: WCAG 10.70 (AAA), APCA -89.08 (R1) |
Light mode: WCAG 1.45 (FAIL), APCA 21.48 (R0) Dark mode: WCAG 1.46 (FAIL), APCA 0.00 (R0) |
--wikt-palette-gold |
#b88d00 | #edd174 | Light mode: WCAG 5.26 (AA), APCA 43.83 (R0) Dark mode: WCAG 1.27 (FAIL), APCA -14.13 (R0) |
Light mode: WCAG 3.07 (FAIL), APCA 57.29 (R0) Dark mode: WCAG 12.31 (AAA), APCA -79.04 (R0) |
--wikt-palette-dullgold |
#826f34 | #c9b165 | Light mode: WCAG 3.28 (FAIL), APCA 27.15 (R0) Dark mode: WCAG 1.78 (FAIL), APCA -33.37 (R0) |
Light mode: WCAG 4.92 (AA), APCA 73.98 (R0) Dark mode: WCAG 8.77 (AAA), APCA -60.32 (R0) |
--wikt-palette-yellow |
#ebe8b9 | #52421c | Light mode: WCAG 12.88 (AAA), APCA 88.17 (R1) Dark mode: WCAG 8.24 (AAA), APCA -84.24 (R0) |
Light mode: WCAG 1.25 (FAIL), APCA 12.48 (R0) Dark mode: WCAG 1.90 (FAIL), APCA -9.21 (R0) |
--wikt-palette-dullyellow |
#dedbc1 | #3a3520 | Light mode: WCAG 11.53 (AAA), APCA 81.39 (R0) Dark mode: WCAG 10.38 (AAA), APCA -88.97 (R1) |
Light mode: WCAG 1.40 (FAIL), APCA 19.35 (R0) Dark mode: WCAG 1.51 (FAIL), APCA 0.00 (R0) |
--wikt-palette-brightyellow |
#ffee77 | #827200 | Light mode: WCAG 13.63 (AAA), APCA 91.82 (R2) Dark mode: WCAG 4.08 (FAIL), APCA -66.20 (R0) |
Light mode: WCAG 1.18 (FAIL), APCA 8.77 (R0) Dark mode: WCAG 3.84 (FAIL), APCA -27.73 (R0) |
--wikt-palette-palegreen |
#e2f6e2 | #112511 | Light mode: WCAG 14.22 (AAA), APCA 94.50 (R2) Dark mode: WCAG 13.69 (AAA), APCA -93.12 (R2) |
Light mode: WCAG 1.13 (FAIL), APCA 0.00 (R0) Dark mode: WCAG 1.14 (FAIL), APCA 0.00 (R0) |
--wikt-palette-palergreen |
#f8fffa | #051f0c | Light mode: WCAG 15.88 (AAA), APCA 102.00 (R4) Dark mode: WCAG 14.70 (AAA), APCA -93.92 (R2) |
Light mode: WCAG 1.02 (FAIL), APCA 0.00 (R0) Dark mode: WCAG 1.06 (FAIL), APCA 0.00 (R0) |
--wikt-palette-mint |
#c0e4c0 | #194819 | Light mode: WCAG 11.60 (AAA), APCA 81.77 (R0) Dark mode: WCAG 8.96 (AAA), APCA -85.80 (R1) |
Light mode: WCAG 1.39 (FAIL), APCA 18.97 (R0) Dark mode: WCAG 1.75 (FAIL), APCA -7.56 (R0) |
--wikt-palette-forestgreen |
#235923 | #499149 | Light mode: WCAG 1.94 (FAIL), APCA 12.60 (R0) Dark mode: WCAG 3.27 (FAIL), APCA -58.94 (R0) |
Light mode: WCAG 8.32 (AAA), APCA 88.45 (R1) Dark mode: WCAG 4.78 (AA), APCA -35.03 (R0) |
--wikt-palette-paleblue |
#f8f9fa | #1c2229 | Light mode: WCAG 15.30 (AAA), APCA 99.43 (R3) Dark mode: WCAG 13.55 (AAA), APCA -93.05 (R2) |
Light mode: WCAG 1.05 (FAIL), APCA 0.00 (R0) Dark mode: WCAG 1.15 (FAIL), APCA 0.00 (R0) |
--wikt-palette-cyan |
#eaffff | #184e4e | Light mode: WCAG 15.55 (AAA), APCA 100.55 (R4) Dark mode: WCAG 7.93 (AAA), APCA -83.27 (R0) |
Light mode: WCAG 1.04 (FAIL), APCA 0.00 (R0) Dark mode: WCAG 1.97 (FAIL), APCA -10.22 (R0) |
--wikt-palette-lightblue |
#d9ebff | #092f58 | Light mode: WCAG 13.27 (AAA), APCA 90.02 (R2) Dark mode: WCAG 11.39 (AAA), APCA -90.31 (R2) |
Light mode: WCAG 1.22 (FAIL), APCA 10.60 (R0) Dark mode: WCAG 1.37 (FAIL), APCA 0.00 (R0) |
--wikt-palette-dullblue |
#49555f | #b8c0c5 | Light mode: WCAG 2.11 (FAIL), APCA 14.51 (R0) Dark mode: WCAG 1.56 (FAIL), APCA -26.35 (R0) |
Light mode: WCAG 7.64 (AAA), APCA 86.56 (R1) Dark mode: WCAG 10.03 (AAA), APCA -67.17 (R0) |
--wikt-palette-dullcyan |
#eaecf0 | #27292d | Light mode: WCAG 13.64 (AAA), APCA 91.76 (R2) Dark mode: WCAG 12.32 (AAA), APCA -91.77 (R2) |
Light mode: WCAG 1.18 (FAIL), APCA 8.84 (R0) Dark mode: WCAG 1.27 (FAIL), APCA 0.00 (R0) |
--wikt-palette-deepblue |
#2f445c | #a5c3e1 | Light mode: WCAG 1.61 (FAIL), APCA 7.87 (R0) Dark mode: WCAG 1.54 (FAIL), APCA -25.79 (R0) |
Light mode: WCAG 9.99 (AAA), APCA 93.13 (R2) Dark mode: WCAG 10.12 (AAA), APCA -67.72 (R0) |
--wikt-palette-lavender |
#f8f8ff | #15202b | Light mode: WCAG 15.25 (AAA), APCA 99.22 (R3) Dark mode: WCAG 13.94 (AAA), APCA -93.39 (R2) |
Light mode: WCAG 1.06 (FAIL), APCA 0.00 (R0) Dark mode: WCAG 1.12 (FAIL), APCA 0.00 (R0) |
--wikt-palette-lightyellow |
#ffffe0 | #24241a | Light mode: WCAG 15.85 (AAA), APCA 101.86 (R4) Dark mode: WCAG 13.23 (AAA), APCA -92.74 (R2) |
Light mode: WCAG 1.02 (FAIL), APCA 0.00 (R0) Dark mode: WCAG 1.18 (FAIL), APCA 0.00 (R0) |
--wikt-palette-red |
#d73333 | #ff4242 | Light mode: WCAG 3.39 (FAIL), APCA 29.63 (R0) Dark mode: WCAG 2.91 (FAIL), APCA -53.31 (R0) |
Light mode: WCAG 4.76 (AA), APCA 71.51 (R0) Dark mode: WCAG 5.38 (AA), APCA -40.65 (R0) |
--wikt-palette-orange |
#f2caa4 | #593e02 | Light mode: WCAG 10.57 (AAA), APCA 76.44 (R0) Dark mode: WCAG 8.40 (AAA), APCA -84.51 (R0) |
Light mode: WCAG 1.53 (FAIL), APCA 24.38 (R0) Dark mode: WCAG 1.86 (FAIL), APCA -8.92 (R0) |
--wikt-palette-lighterblue |
#ebf4ff | #0e1e33 | Light mode: WCAG 14.53 (AAA), APCA 95.92 (R3) Dark mode: WCAG 14.18 (AAA), APCA -93.54 (R2) |
Light mode: WCAG 1.11 (FAIL), APCA 0.00 (R0) Dark mode: WCAG 1.10 (FAIL), APCA 0.00 (R0) |
--wikt-palette-lightred |
#fee7e6 | #421211 | Light mode: WCAG 13.66 (AAA), APCA 91.88 (R2) Dark mode: WCAG 13.39 (AAA), APCA -92.50 (R2) |
Light mode: WCAG 1.18 (FAIL), APCA 8.71 (R0) Dark mode: WCAG 1.17 (FAIL), APCA 0.00 (R0) |
--wikt-palette-indigo |
#aaaaee | #30306f | Light mode: WCAG 7.44 (AAA), APCA 58.46 (R0) Dark mode: WCAG 9.99 (AAA), APCA -88.00 (R1) |
Light mode: WCAG 2.17 (FAIL), APCA 42.55 (R0) Dark mode: WCAG 1.57 (FAIL), APCA 0.00 (R0) |
--wikt-palette-lightindigo |
#e9e9ff | #242448 | Light mode: WCAG 13.49 (AAA), APCA 91.06 (R2) Dark mode: WCAG 12.50 (AAA), APCA -91.89 (R2) |
Light mode: WCAG 1.20 (FAIL), APCA 9.54 (R0) Dark mode: WCAG 1.25 (FAIL), APCA 0.00 (R0) |
--wikt-palette-palerpink |
#fff3f5 | #251111 | Light mode: WCAG 14.89 (AAA), APCA 97.59 (R3) Dark mode: WCAG 15.21 (AAA), APCA -94.33 (R2) |
Light mode: WCAG 1.08 (FAIL), APCA 0.00 (R0) Dark mode: WCAG 1.03 (FAIL), APCA 0.00 (R0) |
| According to mw:Recommendations for night mode compatibility on Wikimedia wikis, editors should ensure that colours meet the WCAC 2.1 AA contrast standards (APCA is significantly stricter but corresponds more closely to human visual perception — see phab:T308772). Contrast ratios are calculated assuming standard text formatting (14px, unbolded) and standard colours on the rest of the page. To check contrast values between any two colours, see https://contrast.tools/. | ||||