@RT Ksenia Kondrashova
Quick video tutorial on a tiny (1.5kb!) SVG animation. It gives the illusion of blobs morphing randomly but it's much easier than it seems
Text version: https://dev.to/uuuuuulala/making-background-blob-animation-in-just-15kb-step-by-step-guide-2482
Live demo & source code: https://codepen.io/ksenia-k/pen/jXbWaJ
Youtube: https://youtu.be/0yp9-_NKPC0
Hosted on @CodePen https://t.co/JlQanIEkER
RT Konstantin Denerz
Have you wondered how to get motion blur effect ✨ with CSS? It works with SVG's Gaussian blur filter.
https://codepen.io/konstantindenerz/pen/zYJzvEQ via @CodePen
#css #motionblur #animation https://t.co/c9KfWhgFYA
RT kotAndy 🐾
My new experiment on @CodePen ☺️
Used @greensock and `mix-blend-mode` css to create interesting night mode effect.
https://codepen.io/kotAndy/live/RwYgxJy https://t.co/lvYY707Jex
RT Luke Meyrick
Sometimes you just wanna...😠😡🤬
http://cdpn.io/lukemeyrick/full/JjaOppW https://t.co/Chsm4Rgvuc
RT LukyVj - A$AP Luky
👋A few weeks ago, I've made my own version of it in #css ✨
Inspired by @learnframer of course 😎
You like it?
Go check it out on @CodePen
🔗https://codepen.io/LukyVj/pen/bGxpORa
#webdesign #frontend https://t.co/1Mw70NIKFO
<div class="rsshub-quote">
Framer University: 🪄 Rt this for a free @Framer (sliding) button component. https://t.co/wd0Jtt9bBA
</div>
https://twitter.com/LukyVJ/status/1633821741628919808
RT Ana Tudor 🐯🖤🌻
Re @CodePen Also made this torus knot https://codepen.io/thebabydino/pen/vYdMVJK??editors=0100
CSS trig functions allow to avoid hardcoding the position vector into a custom prop for each & every item making up the knot as I had to before when coding such shapes:
✨ https://codepen.io/thebabydino/pen/GMmzjP?editors=0100
✨ https://codepen.io/thebabydino/pen/wEqVwz?editors=1000 https://t.co/w7oEa8kYOz
RT Amit Sheen
Just some background pattern animation. 😊
✅ #CSS only.
❎ No divs.
Live demo on @CodePen: https://codepen.io/amit_sheen/pen/zYJzLoy https://t.co/nMIcnJV1Ji
RT Ashraff Hathibelagal
Experimenting with matter.js, a physics library.
https://codepen.io/hathibelagal-dev/pen/xxaXRbg
#javascript #matterjs #codepenchallenge https://t.co/LeOsssfK3d
"Oreo Smash Donuts" by Steve Gardner
https://codepen.io/ste-vg/pen/mdjOaNa https://t.co/CfRcI2M57I
RT Mike-麥-Mai/index.html
OH NO, more minimalist typography CSS from Mike.
OH YES, more minimalist typography CSS from Mike.
I like setting type, what can I say? 🤣
Site: https://mikemai.net/mcss
Github: https://github.com/mikemai2awesome/mcss
@CodePen: https://codepen.io/mikemai2awesome/pen/VwGmMLv
#css #html #minimalism #typography https://t.co/Ujv2jmqXN9
https://twitter.com/mikemai2awesome/status/1632839739756757002
RT David Aerne
Can't get enough of watching live color-palette creations on @CodePen! It's a mesmerising experience that never gets old 💫🎨 #color (chrome struggles with the combination of scale and gradients somehow, safari & ff handle it just fine)
https://codepen.io/meodai/full/XWPaEZy https://t.co/HfWj0UEaiB
✨ Opinion: You probably want "Format on Save" turned on. The global setting is here: https://codepen.io/settings/editor but you can flip it on/off on any individual Pen if you prefer to.
It's just standard-settings Prettier under the hood. https://t.co/E82HFHMhk0
The March #CodePenChallenge starts now!
This month is all about buttons. Let's kick it off with buttons that do something random 🎲
https://codepen.io/challenges/2023/march/1 https://t.co/hmW3rXqGnu
RT Chris Gannon
Manual Loader @CodePen https://codepen.io/chrisgannon/pen/bGKeovd @greensock #javascript #animation https://t.co/1K4xN3fYmG
RT Wakana Y.K.
Which donut is your favorite?😋🍩
Donuts Paradise
Demo : https://codepen.io/wakana-k/pen/BaOQaKM
@CodePen #codepen #threejs #ammojs #donuts https://t.co/eP9p5ujoGY
RT Chris Gannon
Basketball hoop loop 🏀🔄🗑️ @CodePen https://codepen.io/chrisgannon/pen/NWzqyBY @greensock #svg #animation #basketball https://t.co/jIkFtHzEHS
RT Ana Tudor 🐯🖤🌻
For the latest #CodePenChallenge: grainy dissolving an image's edges https://codepen.io/thebabydino/pen/oNMBeye?editors=1100
Done with #CSS + an #SVG filter, heavily commented.
For comparison, the original image in the img tag which you can see on right click, open image in new tab. https://t.co/T0snwG00lr
RT GreenSock
💚 Are you just getting started with animation on the web?
Here's some tips from @cassiecodes to make sure you're animating with performance and accessibility in mind!
MatchMedia Docs → https://buff.ly/3kuJyLG
Demo → https://buff.ly/3IFCIuP https://t.co/oKkf6D3OZp
RT Stefan Bauer
Slide-In Text without resizing and with gradient text https://codepen.io/StfBauer/pen/JjaEqwj via @CodePen #gradient #CSS #animation https://t.co/XSdXlxkH0O
Bot
Build, test, and discover front-end code 👩🏽💻
Joined Dec 2020
