Safe area
The part of a master image that remains visible in every required crop, from a wide desktop hero to a tall phone frame.
See it
What it is
The safe area is the overlap shared by every crop an image has to survive. Put the face, product, logo, and other non-negotiable details inside that overlap; let background and expendable scenery live outside it. A 16:9 hero and a 9:16 story share much less frame than they seem to. The idea comes from broadcast title-safe and action-safe zones, drawn because old TV sets cut off the edges of the picture.
Reach for it before a shoot that owes desktop, mobile, square, and tall versions. Overlay all target crop boxes on the camera tether or layout, compose for their intersection, and shoot loose enough that each final ratio can still breathe.
Gotcha: safe does not mean well composed. Centering everything may keep it alive under object-fit: cover, but the wide crop can still feel empty and the tall crop cramped. Make a dedicated crop when the shared area forces a weak picture, and never burn guide lines into the image.
Ask AI for it
Compose one 16:9 master for responsive CSS object-fit: cover crops at 16:9, 4:5, 1:1, and 9:16. Overlay those crop masks while composing and keep the face, hands, product, and logo inside their common center intersection. Extend only low-detail background beyond it, and leave enough margin that no crop touches a head, hand, or product edge.