State of the Browser

State of the browser is back for the 10th year! Join us in London or online on

Get tickets →

Trigonometry in CSS and JS: A Series

While working on some demos earlier this year, I started to get really interested in trigonometry. Having left the subject alone since school, I initially started brushing up on my knowledge to solve a specific problem. But I was soon drawn in by how a grasp of trigonometry opens up the possibilities for creative coding!

If the subject sounds intimidating, this article series I wrote for Codrops might be for you. In it we walk through the principles of trigonometry and some creative applications in CSS and JS. Starting from the basics, we gain an understanding of the various trigonometric functions, and move through to using them in our CSS code, before graduating to drawing and animating shapes with the Canvas API. I learnt a lot while writing these articles, and I hope you will too. Maths and creative coding need not be intimidating!

Read the articles

  1. Introduction to Trigonometry
  2. Getting Creative with Trigonometric Functions
  3. Beyond Triangles