17 Pure CSS Logos
Collection of hand-picked free HTML and pure CSS logo code examples.
Author
- Moshfequr rahman
About the code
Figma Logo
Figma logo in HTML and CSS flexbox.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
![Switch Logo - GIF Demo]( "Switch Logo")
Author
- William A. | Keyon
About the code
Switch Logo
Nintendo Switch logo in HTML and CSS.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
![Logo Loader - GIF Demo]( "Logo Loader")
Author
- PicturElements
About the code
Logo Loader
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
Author
- Melissa Cabral
About the code
Logo
Experimenting with animating independent SVG elements with CSS.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
![Google Logo - GIF Demo]( "Google Logo")
About the code
Google Logo
A configurable bouncing Google logo.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
![Logo Animation - GIF Demo]( "Logo Animation")
About the code
Logo Animation
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
![Logo Animation - GIF Demo]( "Logo Animation")
Author
- Maciej Leszczyński
Made with
- HTML (Pug) / CSS (Stylus)
About the code
Logo Animation
Compatible browsers: Chrome, Firefox, Opera, Safari
Dependencies: -
![Logo - Animated - GIF Demo]( "Logo - Animated")
Author
- Sam Markiewicz
About the code
Logo - Animated
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
![Snowing Logo - GIF Demo]( "Snowing Logo")
About the code
Snowing Logo
Just a proof of concept while ideas being tossed around.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
![Pyramid Logo Hover Animation - GIF Demo]( "Pyramid Logo Hover Animation")
Author
- Michael Hobizal
About the code
Pyramid Logo Hover Animation
Tried to make a 3D logo hover effect with CSS.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
![Northerli Logo - GIF Demo]( "Northerli Logo")
Author
- Chris Holder
About the code
Northerli Logo
Animated SVG logo for Northerli. Hover for motion.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
Author
- Tharun Jose
About the code
Webandcrafts Logo - Pure CSS
WebandCrafts logo designed with border-radius, box-shadow and CSS transforms. Click the logo for exploded view.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
About the code
Logo MDN CSS
Only one div.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
Author
- Hugo DarbyBrown
About the code
Shop Talk Logo Made in CSS
A CSS only version of the Shop Talk logo complete with a data URI texture. Added some JS, just to show the difference when scaling up.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
![Codepen.io Logo - GIF Demo]( "Codepen.io Logo")
Author
- Philip Da Silva
About the code
Codepen.io Logo
Single element Codepen.io logo. Pure CSS using box-shadow and CSS3 transforms with just a hint of CSS3 filtering to help with anti-aliasing.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
Author
- Hugo Giraudel
About the code
Brackets Logo
Single element Brackets logo.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
![Logo with CSS - GIF Demo]( "Logo with CSS")
About the code
Logo with CSS
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -