background preloader

SASS/compass/LESS

Facebook Twitter

SASS & Color Variables. If you write CSS and you’re not using SASS & Compass yet, you should stop whatever you’re doing and go download Codekit right now. Do it, you’ll thank me later. But if you’re already familiar with the awesomeness that is SASS, I’d like to share a small tip about handling color variables. The CSS Way First of all, just so we’re all on the same page, here’s how you’d use colors in plain old dumb CSS: Simple enough. But the problem is that if I want to change a color, I usually have to change it in multiple places. Variables to the Rescue SASS lets us define reusable variables, which can be used for any type of value but are especially useful for colors: This will work great… as long as your links are blue. Our “$blue” color is now actually red! Functional Variable Names Thankfully there’s a simple solution: instead of using variable names that describe the color, we’ll use names that describe the color’s function. Now we can change our link color without introducing any ambiguities in our code.

Compass Home | Compass Documentation. CodeKit — THE Mac App For Web Developers. Browser Sandbox - Spoon.net. Coda Clips.