Border Radius animate with duration in Framer X
Published in
1 min readDec 9, 2018
What
Some Properties including radius (border-radius) and box-shadow doesn’t animate with ‘duration’ property in Framer X
animate.easeInOut(data.noseRadius, '20px', { duration: 3,})
(It goes to fail)
How
Return ‘style’ transition property instead of duration
export const Nose: Override = () => { return { radius: data.noseRadius, shadows: data.noseBoxShadow, style: { transition: 'border-radius .3s ease-in-out, box-shadow 2s ease-in-out', }, }}