Perceptually smooth multi-color linear gradients

Matt DesLauriers / filed under Javascript

If you try evenly spacing different colors across a typical linear gradient (e.g. made with Photoshop or HTML5 Canvas), you may find it leads to sharp or unusual transitions across the surface. Here’s a typical linear gradient with Red, Green and Blue color stops:

Subscribe to newsletter

Design and frontend links delivered to your inbox every day and week. No spam, unsubscribe at anytime.

Choose frequency

Permission