If you’ve started to code a long time ago, some of the snippets on this page won’t surprise you that much. Not that they wouldn’t be impressive, but because you are already used to the tech advancements in web design.
For those of you who are beginners, though, some of these below may seem a bit sci-fi.
Enjoy these wonderful snippets and use them in your websites. Make sure to check if they look good across all the browsers.
Sliders
Rage Slider
Unicycle Range Slider
Rolling Range Slider
Vertical Slider
Range slider with dynamic icons
Typography
Layered text-shadow effect CSS
Cards and hover animations
Card Hover Interactions
Stacked rainbow cards
Product Card – Three JS
Article Deck
Forms and Pagination
Pagination with morphing numbers
3D Textbox
Password Input Light
Birthday input with zodiac
Buttons and navigation
Toggle animation with CSS & State Machines! Live collaborative coding with the @keyframers
Smash to submit button
Tilt Toggle
Folding Select Dropdowns
Night & Day
Neuomorphic Checkboxes
Tabbar animation – Only CSS
“Toss” Add to Cart Animation
Button – Hold to confirm
3D Button
Paw Clap Button
Checklist
Checklist animation
Neumorphic Radio
CSS illustrations
Parish
Full Moon in Paris?
Saturn
snowyLandscape – created by pure JavaScript and canvas
Animated Night Hill Illustration – Pure CSS
Steam spooky house
Only CSS: Sunset Bird
Games and experiments
Cat and Mouse
Liquid Grid
Pure CSS Claw Crane
What’s behind ?
Calm Spikes
Unsubscribe game
Tangram Memory Game
Waves (SVG)
subscribercoaster
CSS Goey footer
CSS Hangman using :checked [CPC]
Dual Triangle Preloaders
Svelte Infinity Maze
A matter of gravity
CSS code experiments that take coding to the next level
