JA EN

Border

A line drawn around images or UI elements, used for visual separation, decoration, or emphasis.

A border is a line rendered along the perimeter of an image or UI element. It serves purposes such as adding frame-like decoration to photos, clearly separating images from page backgrounds, and creating visual emphasis. In CSS, the border property controls thickness, style, and color.

Common use cases include making photos stand out in social media posts, clarifying boundaries when multiple images are arranged together, and adding Polaroid-style white frames for a retro aesthetic. A border width of 1-5% of the image dimensions typically looks natural.

Adding borders to web images can be done via CSS border or outline properties, or by baking the frame directly into the image file. The latter approach uses the resize tool to expand the canvas and create margins. Combining borders with rounded corners produces a more modern appearance.

Related Terms

Related Articles