Skip to main content

Command Palette

Search for a command to run...

Frontend Tip (1) : Animating Keywords

Published
1 min read
D

I'm a 5+ experienced Frontend Engineer with solid experience in UI/UX Designing, I enjoy using my obsessive attention to detail, my unequivocal love for making things, always being excited to make a big impact and go through new challenges.

✨ If you've ever worked with CSS animations, you know the pain of trying to animate size properties that involve keywords like auto.

Traditional CSS just doesn’t natively handle transitions between numerical values and keywords, but by using interpolate-size: allow-keywords you can know a do smooth animation and transition between the numerical values like (px,rem...etc) and the keywords like auto.

⚠️ Browser Compatibility Warning
Make sure to check browser support and provide fallbacks if you plan to experiment with it in your projects.

https://lnkd.in/d8WdwzEv