Skip to content
Priyatam Mudivarti edited this page Dec 7, 2015 · 2 revisions

Introduction

What would a stylesheet be like with out color? No fun. That's what it would be like. And the person who's interested in writing a stylesheet in Clojure probably wants tools for working with color. Who wants to write a stylesheet where colors are strings that look like "#A55"? No one. That's who.

Since 0.1.0-beta5 Garden comes with a (mostly) complete set of functions for dealing with colors. If you've worked with Sass you'll be pleased to know many of the same color functions are available in Garden.

Garden's color functions are available in the garden.color namespace.

user=> (require '[garden.color :as color :refer [hsl rgb]])

Let's create a color to work with.

user> (def red (hsl 0 100 50))
#'user/red
user> red
#ff0000

We've defined red in terms of the HSL value for pure red with the hsl function (rgb is also available). When we evaluate the value of red at the REPL we notice it is displayed in the familiar hexadecimal format.

Let's apply some color functions to it. By the way, if you're using Emacs, try turning on rainbow-mode to see the colors highlighted.

;; Make dark red.
user> (color/darken red 25)
#800000
;; Make light red.
user> (color/lighten red 25)
#ff8080

But, wait! There's more!

;; Make an orange color...
user> (def orange (color/hsl 30 100 50))
;; ...and mix it with red.
user> (color/mix red orange)
#ff4000
;; Make a green color...
user> (def green (hsl 120 100 50))
;; ...and add it to red to get yellow.
user> (color/color+ red green)
#ffff00
;; Get a set of analogous colors.
user> (color/analogous red)
(#ff0000 #ff8000 #ffff00)

Advanced

As with units, colors can be added, subtracted, divided and multiplied with color+, color-, color*, and color-div respectively. There are several other nice functions available for finding color complements, triads, tetrads, and more.

Clone this wiki locally