CSS `@function` + relative colors = adaptive palettes that match content tone. Demo: codepen.io/mobalti/full... cc @miriam.codes @tabatkins.com @lea.verou.me #CSS

I re-created Open Props shadows with the new CSS `@function`. This spec is wild ♥️ and it solves problems we’ve been chasing in CSS for years. Demo 👉 codepen.io/mobalti/pen/... cc @miriam.codes @tabatkins.com @bram.us

Hero in Monochrome The elegance of OKLCH in action: adaptive color with built-in accessibility Built with Open Props CodePen: codepen.io/mobalti/full... #css #html #webDev

Cards with animated gradient borders Modern CSS ⚡💪 Gradient from gradient.style CodePen: codepen.io/mobalti/pen/... @codepen.io #CSS

Meet the future of carousels: no JS, just CSS! ✅ Scroll Buttons ✅ Scroll Markers ✅ Scroll-State Queries ✅ Scroll Initial Target ✅ Anchor As @nerdy.dev said: "It'd be very difficult to make a more accessible carousel than this." @codepen.io 👉 codepen.io/mobalti/full...

Infinite Orbit Animation with CSS Trigonometry & @property ✅ Pure CSS Orbit Animation → No JavaScript required ✅ Dynamic Tooltips → Auto-adjust position & alignment with Style Queries Huge thanks to @bram.us for the fantastic article! @codepen.io Live demo : codepen.io/mobalti/full... #CSS

Props Color Finder Updates: - Enhanced contrast for picked colors - Added option to pick the closest named CSS colors - Introduced OKLCH color picking - Enabled LAB Mode for perceptual color matching - Added Quick Pick button (beta) leveraging the EyeDropper API props-color-finder.netlify.app

Check out this AI chat hero section example on @codepen.io with a cool backdrop. It creates a futuristic feel that influences user behavior. It is a perfect fusion of aesthetics and functionality. CodePen: codepen.io/mobalti/full...

Using the Web Audio API, I built this Beat Reactor (audio-reactive) with a 3D text effect. Crafted with Open Props. Check it out on CodePen: codepen.io/mobalti/full... @codepen.io #CSS #HTML