teddymatayoshi1d ago
CSS Animation – Burst Effects Using Animation Delays, Transform and Gradients - Part 1
https://pyxo.me/081627 #pyxofy #cssanimation #codenewbie
Burst Effects Using Animation Delays, Transform and Gradients - Part 1

Ever wondered how burst animations are made? We break it down step by step so anyone can build one from scratch!

Pyxofy
Pyxofy1d ago
CSS Animation – Burst Effects Using Animation Delays, Transform and Gradients - Part 1
https://pyxo.me/081627 #pyxofy #cssanimation #codenewbie
Burst Effects Using Animation Delays, Transform and Gradients - Part 1

Ever wondered how burst animations are made? We break it down step by step so anyone can build one from scratch!

Pyxofy
Ana Tudor 🐯Feb 17

Hi, Mastodon 🦣 - could you help me out?

If you can test in actual Safari, is this on-scroll demo glitchy there too like it is for me in Epiphany?

https://cdpn.io/pen/debug/JoKqRjZ

If you cannot test in actual Safari, boosts appreciated.

Thank you! 🙏

PS - Yes, I know it doesn't work in Firefox, it's because of this bug some rando filed a couple of years ago... https://bugzilla.mozilla.org/show_bug.cgi?id=1927325

#CSS #cssScrollAnimation #code #coding #web #dev #webDev #webDevelopment #frontend #cssAnimation #cssTransforms

AndrewJan 20

https://codepen.io/alsorew/pen/dPXWmed

Hover or tap inside the blue line to discover the secret.

(You can make the animation smoother, but it would require a lot more work. Nah.)

#SteamDeck #SteamMachine #VoidLinux #CSS #PureCSS #CSSAnimation #CodePen

Void Steam

...

teddymatayoshiJan 18
CSS Animation – How to Use Keyframes and steps() to Animate an Analog Alarm Clock - Part 2
https://pyxo.me/ec4f86
#pyxofy #cssanimation #codenewbie
CSS Animation – How to Use Keyframes and steps() to Animate an Analog Alarm Clock - Part 2

Learn to rotate, scale, and fade in elements with pure CSS! Follow this step-by-step article to create stunning and visually catchy animations.

Pyxofy
PyxofyJan 17
CSS Animation – How to Use Keyframes and steps() to Animate an Analog Alarm Clock - Part 2
https://pyxo.me/ec4f86 #pyxofy #cssanimation #codenewbie
CSS Animation – How to Use Keyframes and steps() to Animate an Analog Alarm Clock - Part 2

Learn to rotate, scale, and fade in elements with pure CSS! Follow this step-by-step article to create stunning and visually catchy animations.

Pyxofy
PyxofyJan 11
CSS Animation – How to Use Keyframes and steps() to Animate an Analog Alarm Clock - Part 1
https://pyxo.me/21ae5c #pyxofy #cssanimation #codenewbie
CSS Animation – How to Use Keyframes and steps() to Animate an Analog Alarm Clock - Part 1

Learn to animate an analog alarm clock using only CSS! Spin the clock hands and dynamically scale the clock body in this step-by-step article.

Pyxofy
teddymatayoshiJan 11
CSS Animation – How to Use Keyframes and steps() to Animate an Analog Alarm Clock - Part 1
https://pyxo.me/21ae5c
#pyxofy #cssanimation #codenewbie
CSS Animation – How to Use Keyframes and steps() to Animate an Analog Alarm Clock - Part 1

Learn to animate an analog alarm clock using only CSS! Spin the clock hands and dynamically scale the clock body in this step-by-step article.

Pyxofy
Ana Tudor 🐯Jan 5

Noticed this got featured on @codepen: an animated XOR background - enjoy!

https://codepen.io/thebabydino/pen/JoKYVeB

Made this to answer a question from reddit https://www.reddit.com/r/css/comments/1q242on/comment/nxag5vj/?context=3

#CSS #gradient #blending #cssGradient #blendMode #xor #difference #coding #cssPattern #cssAnimation #frontend #web #dev #webDev #webDevelopment #code

Ana Tudor 🐯Dec 19

One of my earliest #CSS #3D demos on @codepen: how to (de)construct a dodecahedron https://codepen.io/thebabydino/pen/ALQVQe

A dodecahedron is one of the 5 regular polyhedra = made up of only identical regular polygon faces. Regular polygons have all edge lengths and vertex angles equal.

#geometry #Maths #code #coding #css3D #cssTransforms #transform #frontend #polyhedron #polyhedra #PlatonicSolid #dodecahedron #cssAnimation #web #dev #webDev #webDevelopment #trigonometry #Sass #SCSS