Image FXcssimagelab.com
Image
Studio fashion portrait in warm light

Hover to draw the corner brackets into a full frame.

Frame · 24 / 35

Corner Draw

Corner brackets that draw outward into a full outlined frame on hover.

Adjust
2px
34%
450ms
Metadata
interaction
Hover · static fallback
browser
Universal
reduced motion
included
touch fallback
Static on touch
Edit the CSS above — the preview updates live.

About Corner Draw

Corner Draw paints thin brackets in each corner of the image that expand into a full outlined frame on hover or keyboard focus. Tune --ifx-cc for the line color, --ifx-ct for stroke thickness, --ifx-len for the resting corner length, and --ifx-duration for the draw speed. The brackets stay visible at rest, so the effect still reads on touch and under reduced-motion.

Use cases

  • portfolio
  • gallery
  • editorial

Browser support

Universal.

Accessibility

  • Essential content is never hidden behind hover.
  • Includes a prefers-reduced-motion fallback.
  • Touch fallback: static on touch.
  • Keyboard accessible — the effect also triggers on focus-within.