Totoro Toggle
Very nice and simple Totoro toggle switch.
Made with: HTML (Haml),CSS (SCSS)
Css Grid Art Poster
This example shows how CSS grid can be used to re-create a vertically responsive version of a modernist-inspired, geometric, grid-based poster titled 'Not a Guarantee' by Tom Davie.
Made with: HTML,CSS
Details/Summary Animated Accordion
You can use this without JS and it works fine, except for the closing animation.
Made with: HTML,CSS (SCSS),JavaScript
Animated Hexagon Circle Logo
Logo animation using anime.js.
Made with: HTML,CSS (SCSS),JavaScript
Fluid Tab Bar
Fluid tab bar in SVG, HTML, CSS and JS.
Made with: HTML,CSS (Stylus),JavaScript
Matrix Wave Loading Animation
Matrix wave loading animation in HTML and CSS.
Made with: HTML (Pug),CSS (SCSS)
Pure Css Slider
Simple slider based on radio inputs. 100% pure HTML + CSS. Works also with arrow keys.
Made with: HTML,CSS
Duotone Filtering With Css Variables
Was playing with mix-blend-mode to create different duotone filters. Then I thought it might be cool to have a handy selector wheel to try out different filters. So here it is! A duotone filtering tester using CSS variables. The inner ring is the lightening color whilst the outer is the darkening color. To change the colors, adjust the colors variable in the pug code.
Made with: HTML (Pug),CSS (Stylus),JS (Babel)