• Previous CSS Tip
• Next CSS Tip

Card reveal animation

Add a cool text reveal animation to your image card

• Minimal HTML
• No pseudo-element
• Powered by CSS Mask (with fallback for old browsers)

See the Pen Card hover effect by Temani Afif (@t_afif) on CodePen.

More CSS Tips

• CSS-only gradient shadows
• A border-only Tooltip using mask & clip-path
• A rainbow gradient animation
• Fancy Rounded frame around your images
• How many elements your container has?
• A CSS-only wavy shapes