Pure Css "Spin-Out" Menu
Hover the menu and all of it's items flare out!
Made with: HTML,CSS (SCSS)
![Pure Css "Spin-Out" Menu](https://img.cssmix.net/img/2022/9/2325_pure-css-"spin-out"-menu.webp)
![Banner Google Engage Css](https://img.cssmix.net/img/2022/7/banner-google-engage-css_1686.webp)
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.
Made with: HTML,CSS (SCSS)
![Codepen.Io Logo](https://img.cssmix.net/img/2022/7/codepen.io-logo_3675.webp)
![Orbital Css](https://img.cssmix.net/img/2022/7/orbital-css_4498.webp)
![Animated Search Form](https://img.cssmix.net/img/2022/7/animated-search-form_4311.webp)
Flipping Thumbnails
Flipping thumbnails in HTML, CSS and JavaScript.
Made with: HTML,CSS,JavaScript
![Flipping Thumbnails](https://img.cssmix.net/img/2022/7/flipping-thumbnails_4937.webp)
![Typing Text Animation](https://img.cssmix.net/img/2022/8/5135_typing-text-animation.webp)
Circular Reveal
Trying to make a CSS-only circular hide/reveal. Seems a little element-heavy, but you can't animate pseudo elements.
Made with: HTML,CSS (SCSS)
![Circular Reveal](https://img.cssmix.net/img/2022/9/4225_circular-reveal.webp)
![Css3 Linear Gradient Pattern](https://img.cssmix.net/img/2022/7/css3-linear-gradient-pattern_3449.webp)
![Speech Bubble](https://img.cssmix.net/img/2022/7/speech-bubble_4514.webp)
Animated Weather Icons
This is a little set of animated single element CSS weather icons.
Made with: HTML (Haml),CSS (SCSS),JS
![Animated Weather Icons](https://img.cssmix.net/img/2022/9/5182_animated-weather-icons.webp)
![Corner Ribbon](https://img.cssmix.net/img/2022/7/corner-ribbon_4244.webp)
![Simon Goellner](https://img.cssmix.net/img/2022/7/simon-goellner_1805.webp)
![Blockquote Stylée Littéraire](https://img.cssmix.net/img/2022/7/blockquote-stylée-littéraire_4136.webp)
![Simple Snake Game](https://img.cssmix.net/img/2022/7/simple-snake-game_5928.webp)
Responsive Rounded Ribbon
Change the background color of the .ribbon class or change the font size of the .content div or resize the window to see how it behaves.
Made with: HTML,CSS
![Responsive Rounded Ribbon](https://img.cssmix.net/img/2022/7/responsive-rounded-ribbon_4245.webp)
Css Ribbon
Fully scalable CSS ribbon. Change the font-size and line-height to see for yourself.
Made with: HTML,CSS (SCSS)
![Css Ribbon](https://img.cssmix.net/img/2022/7/css-ribbon_4246.webp)
![Animated Progress Bar](https://img.cssmix.net/img/2022/7/animated-progress-bar_4115.webp)
Linear Gradient Columns
Used background: linear-gradient to create a pattern of columns.
Made with: HTML,CSS
![Linear Gradient Columns](https://img.cssmix.net/img/2022/7/linear-gradient-columns_3450.webp)