Skip to content

Missing CSS optimization - colors #315

Description

@SpeednetGroup

Please update the CSS optimizations in NUglify to optimize colors.

The shortest methods of including a color in CSS are either with the color name (red, blue, etc.) or with a 6- or 3-digit hex string (#f0f0f0, #e00, etc.).

All CSS colors, except those that include an opacity, should be converted to the shortest color represented either by name or 6- or 3-digit hex string. That would include colors defined by RBG notation (using specific numbers or percentages) and possibly HSL.

RGB is pretty simple to convert to a hex string, which can then be evaluated for possible shrinking to 3-digits or converted to the corresponding name.

Colors that are shorter as hex strings

aliceblue => #f0f8ff
antiquewhite => #faebd7
aquamarine => #7fffd4
black => #000
blanchedalmond => #ffebcd
blueviolet => #8a2be2
burlywood => #deb887
cadetblue => #5f9ea0
chartreuse => #7fff00
chocolate => #d2691e
cornflowerblue => #6495ed
cornsilk => #fff8dc
darkblue => #00008b
darkcyan => #008b8b
darkgoldenrod => #b8860b
darkgray => #a9a9a9
darkgreen => #006400
darkkhaki => #bdb76b
darkmagenta => #8b008b
darkolivegreen => #556b2f
darkorange => #ff8c00
darkorchid => #9932cc
darksalmon => #e9967a
darkseagreen => #8fbc8f
darkslateblue => #483d8b
darkslategray => #2f4f4f
darkturquoise => #00ced1
darkviolet => #9400d3
deeppink => #ff1493
deepskyblue => #00bfff
dodgerblue => #1e90ff
firebrick => #b22222
floralwhite => #fffaf0
forestgreen => #228b22
fuchsia => #f0f
gainsboro => #dcdcdc
ghostwhite => #f8f8ff
greenyellow => #adff2f
honeydew => #f0fff0
indianred => #cd5c5c
lavenderblush => #fff0f5
lawngreen => #7cfc00
lemonchiffon => #fffacd
lightblue => #add8e6
lightcoral => #f08080
lightcyan => #e0ffff
lightgoldenrodyellow => #fafad2
lightgreen => #90ee90
lightgrey => #d3d3d3
lightpink => #ffb6c1
lightsalmon => #ffa07a
lightseagreen => #20b2aa
lightskyblue => #87cefa
lightslategray => #789
lightsteelblue => #b0c4de
lightyellow => #ffffe0
limegreen => #32cd32
mediumaquamarine => #66cdaa
mediumblue => #0000cd
mediumorchid => #ba55d3
mediumpurple => #9370db
mediumseagreen => #3cb371
mediumslateblue => #7b68ee
mediumspringgreen => #00fa9a
mediumturquoise => #48d1cc
mediumvioletred => #c71585
midnightblue => #191970
mintcream => #f5fffa
mistyrose => #ffe4e1
moccasin => #ffe4b5
navajowhite => #ffdead
navyblue => #9fafdf
olivedrab => #6b8e23
orangered => #ff4500
palegoldenrod => #eee8aa
palegreen => #98fb98
paleturquoise => #afeeee
palevioletred => #db7093
papayawhip => #ffefd5
peachpuff => #ffdab9
powderblue => #b0e0e6
rosybrown => #bc8f8f
royalblue => #4169e1
saddlebrown => #8b4513
sandybrown => #f4a460
seashell => #fff5ee
whitesmoke => #f5f5f5
yellowgreen => #9acd32

Colors that are shorter as hex strings, but need to be substituted last because they are partial macthes for other color names

goldenrod => #daa520
lavender => #e6e6fa
magenta => #f0f
seagreen => #2e8b57
slateblue => #6a5acd
slategray => #708090
springgreen => #00ff7f
steelblue => #4682b4
turquoise => #40e0d0
white => #fff
yellow => #ff0

Colors that are shorter as CSS names

#f0ffff => azure
#f5f5dc => beige
#ffe4c4 => bisque
#a52a2a => brown
#ff7f50 => coral
#ffd700 => gold
#808080 => gray
#008000 => green
#4b0082 => indigo
#fffff0 => ivory
#f0e68c => khaki
#faf0e6 => linen
#800000 => maroon
# 000080 => navy
#808000 => olive
#ffa500 => orange
#da70d6 => orchid
#cd853f => peru
#ffc0cb => pink
#dda0dd => plum
#800080 => purple
#f00 => red
#fa8072 => salmon
#a0522d => sienna
#c0c0c0 => silver
#fffafa => snow
#d2b48c => tan
#008080 => teal
#ff6347 => tomato
#ee82ee => violet
#f5deb3 => wheat

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions