💡 CSS Tip! Get the scroll progress of the... page as a CSS variable using a few lines of code ✅ Powered by Scroll driven animations ✅ Defined at the root level ✅ Typed using @​property ✅ You can easily use it within any formula CodePen.IO demo in the reply 👇show more

💡 CSS Tip! Do you know that One-Time password... field? You can create it using only one input and a few lines of CSS. The HTML: <input type="text" maxlength="6"> Code & Demo: You can control the number of characters by adjusting the maxlength attribute.show more

Use the scroll-padding CSS property when using a scroll... fade so your items don't get stuck in the fade region. Bonus: It also makes clicking through each option way more convenient!show more

Tailwind CSS Tip (24/30) ✨ You can create a... transparent text effect in Tailwind CSS using (•••••••••••) Guess the CSS Property. You can use this Play Link as a starter: Answer will be shared later today 😉show more

🎮 New CSS Game! What about a CSS game... that you can play with your keyboard? No, it's not a joke but a reality! Play "Super CSS Mario", the first CSS-Only game playable using your keyboard. CodePen.IO demo in the next tweet 👇 0% JavaScript - 100% CSS Magic! Have fun🤩show more

A little sneak peek into one of many animations... done for a new project Last9. 🙈 → The motion is in sync with the scroll progress. Created using SCSS and a little bit Svelte magic to control the CSS Variables.show more

💡 CSS Tip! Two circles, one arrow, and CSS... magic. 🪄 A cool demo packed with modern features (anchor positioning, attr(), container queries, shape(), and more!) 🤩 The shape and position of the arrow are fully controlled using CSS.show more

kinda wild how far you can get with CSS... alone a scroll animation tied to the content scroll powers the percentage update + icon animation interpolate-size provides a way to transition the popover between button size and content size using starting-style 🤙show more

Quick demo of this CSS-driven configuration coming in Tailwind... CSS v4 — creating a new `font-comic` utility by just creating a new CSS variable under our new `@​theme` directive. No JS configuration file, all the same theme customization flexibility 🤩show more

It's cool. But the issue is that the result... is arguably too much code from using "no code" 🙃 It could be a basic <ul> with CSS scroll-snap. Then the buttons use JavaScript's Element.scrollIntoView 🤙 Instead, it's <div>s, JS powered animation, and not a <button> in sight 🫠show more

💡 Do you know about the `clip` value? In... CSS, we can clip a container along a single axis by using the `clip` value. Learn more in this interactive article about the `clip` value:show more

Reanimated 4.3.0 is out with a lot of exciting... features! 🚀 ✦ CSS animations for SVG components – animate vector graphics with just a few lines of code ✦ Shared Values on multiple threads at once – easily control animations in apps that already have a lot of multithreaded code And that's not all – check out the full release notes! ⬇️show more

The new Honor Robot Phone is here! ✅ It... can track objects around you and interact with it ✅ It can dance to your songs ✅ It automatically recognises the best framing for your photos ✅ The camera has 3-axis gimbal stabilisation (4DoF Gimbal System) ✅ AI-powered all-angle video calling Best of all, Honor aims to sell this phone in China by the second-half of 2026! So, it is more than just a concept at the end of the day.show more

We broke down the funnel of a $10B DTC... Fashion Brand. ✅ Ads ✅ Homepage ✅ Collection Page ✅ Product Page ✅ Cart ✅ Checkout ✅ Mega menu Want the full funnel breakdown? Like + comment "CRO" and I'll DM it to you. Repost for priority access. (MUST BE FOLLOWING ME so I can DM it to you!)show more

What if I will tell you how we could... solve fit-to-width text with pure CSS without any hardcoded parameters? Curiously, scroll-driven animations will allow us to do just that! I wrote a new article where I continue exploring the experimental implementations of the latest specs.show more

🤩 I just learned a super cool trick! Do... you know how sometimes you want to record while you scroll on a website, like for a demo or something... But by using the mouse to scroll it turns out to be kinda janky and it doesn't look very good? No? Just me? 🤭 Well, I found out that if you paste this code in the console of your browser: ` setInterval(() => window.scrollBy(0, 4), 16); ` You can make the browser automatically scroll for you! And it looks super cool in the recording! 😎show more

💡CSS techniques: "The Backlight" Using a blur filter you... can create an elegant backlight (or a "smart shadow") effect for your images. In a pseudo-element: 1⃣ `inherit` a background 2️⃣ blur it 3⃣ put it behind the main element using z-index Here's how it works:show more

Happy new year from all of us here at... zaza delivery! We appreciate every one of you guys and girls for the continued support! 2025 is going to be a crazy year for the zaza delivery family! 🙏🙏 using code x30 at checkout ✅✅show more