How to configure SASS to output shorthand hex colors

Question

Is there any way to make SASS or Compass give you a shortened hex color? For example, if I type #444 it gives me #444444 in my output file, which isn't a real optimization help for me.

Nowlin

Answer 1

The color codes are optimized only when the output style is set to compressed.

// style.scss
$primary-color: #444;
$secondary-color: #ffffff;
.test {
  background: $primary-color;
  color: $secondary-color;
}

compiled with the command sass -t compressed style.scss style.css produce the following file:

// style.css
.test{background:#444;color:#fff}

Galangal