Objectives

  • Explain what CSS is and how it is helpful for developers
  • Introduce CSS properties and selectors
  • Show how CSS can be used to create artwork
  • Students will create their own artwork using CSS

What We Will Cover

I enjoy CSS because it merges math, programming, and visual design. Online I've seen gorgeous artwork built using only CSS -- like this single div Grace Hopper and this adorable Koala. I decided to teach myself how to create artwork like the ones above -- though I am definitely a software engineer not an artist. I found that creating art with CSS strengthened my "regular" CSS skills that I use for creating traditional web pages. CSS art is fun to learn, both to create art and to strengthen your development skills! This talk will discuss both the fundamentals of CSS and the fundamentals of CSS for creating art. We will start at zero, but it will be a great refresher for people wanting to strengthen their coding skills or people looking to get more artistic with their code.

What Students Will Create

A piece of artwork built in CSS!

We will all start with drawing an animal in CSS together, which will introduce CSS fundamentals and placement (stuff like coloring, creating shapes, and positioning).

Then, students will break off and build their own art in CSS -- I will be there for support and the other students will be available to help. I will give suggested pieces of art and further examples if needed!

Why This Workshop

I hear all the time from developers that their least favorite tool they work with is CSS. I want people to walk away from my workshop with a new appreciation for how powerful, helpful, and straightforward CSS can be! I also want people to see how creative and artistic they can be through code.

The workshop will extend my article on this topic!