Drawing a Face Using Pure CSS (CSS Art)

by | January 1, 2021 | Website Development

This page may contain affiliate links to recommended products or services. If you choose to purchase after clicking a link, I may receive a commission at no additional cost to you.

Last updated on: February 7, 2023

Did you know you can use pure CSS to create art?

Graphic design using CSS isn’t the easiest. However, the result looks a lot like SVG images. And, having the entire graphic be CSS makes every detail extremely customizable and scalable on the fly, so it’s a really unique technique.

This is my first attempt at CSS art — and definitely my first try at making a face. I had a lot of fun experimenting with different CSS properties and coming up with a drawing of a face — complete with hair, eyes, ears, nose, tongue, teeth, and glasses. Pretty awesome, right?

Check it out:

See the Pen CSS Face by Floyd Hartford (@floyd) on CodePen.

Floyd Hartford is a website developer from southern Maine. He's focused on creating and building WordPress websites and loves spending time digging into code like HTML, CSS, scss, jQuery, PHP, and MySQL.


Submit a Comment

Your email address will not be published. Required fields are marked *

5 × three =

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

Looking for WordPress Help?

I’m a freelance web developer specializing in small business and corporate marketing websites.

Pin It on Pinterest