Kilian Valkhof

Building tools that make developers awesome.

An outline version of the new CSS logo

CSS & HTML, 20 November 2024, < 1

CSS got a new logo! After well over a decade of using the “CSS3” badge, there’s now a new CSS logo that fits nicely next to the JS, TS and friends logo’s.

CSS Logo A purple square with rounded corners and the letters CSS inside in white

And here it is among friends:

CSS, JS, TS, WA and HTML logos

Looks pretty good right?

Outline version

I can’t wait to see this replace the “CSS3” badge across the web and wanted to update the icon for the Live CSS panel in Polypane too.

All the icons in Polypane are from the Tabler icons icon set which are all in “outline style” on a 24 by 24px grid, so last Friday I spent a few hours creating a 24 by 24 pixel outline version of the logo, shown here at 24px, 48px, 128px and 256px.




The official repo isn’t accepting variants but I’ve proposed it for inclusion in Tabler icons here: CSS icon #1266 so if you’d like to see it added make sure to leave a comment or Emoji response there.

Grab it here

Otherwise, just grab the icon from this page, for example by right-clicking them in Polypane and selecting “Copy SVG as code”.

Polypane browser for responsive web development and design Hi, I'm Kilian. I make Polypane, the browser for responsive web development and design. If you're reading this site, that's probably interesting to you. Try it out!

Related Posts

Do you know about overflow: clip?
11 August 2022, 5 minute read

You probably know overflow: hidden, overflow: scroll and overflow: auto, but do you know overflow: clip? It's a relatively new value for the overflow property, and with Safari 16 being released later this year all evergreen browsers will support it. So what does it do?

Comparing CSS Specificity values
17 January 2022, 5 minute read

CSS Specificity is usually written out as [a,b,c] for ID’s, classes and elements respectively. Even a single ID is more specific than any number of classes or elements, so it’s displayed as an array and can’t really be fitted into a single number. How do you compare two selectors to decide which has the highest […]

I no longer understand prefers-contrast
8 March 2023, 3 minute read

The prefers-contrast media query indicates whether someone prefers more or less contrast within the boundaries of your sites design. At least, that’s what I thought it meant, and it’s also how macOS seems to implement it with their ‘increase contrast’ accessibility feature. This is in contrast to the forced-colors media query, which overwrites all your […]