枠線・ボーダー
読み: わくせん・ぼーだー
画像やUI要素の周囲に表示する線。視覚的な区切りや装飾として使用される。
枠線 (ボーダー) とは、画像や UI 要素の外周に描画される線のことである。写真に額縁のような装飾を加えたり、Web ページ上で画像と背景の境界を明確にしたりする目的で使用される。CSS では border プロパティで太さ・スタイル・色を指定する。
画像に枠線を付ける場面としては、SNS 投稿で写真を目立たせたい場合、複数画像を並べた際に境界を明確にしたい場合、ポラロイド風の白枠を付けてレトロな雰囲気を演出したい場合などがある。枠線の太さは画像サイズの 1〜5% 程度が自然に見える目安である。
Web 上で画像に枠線を追加するには CSS の border や outline を使う方法と、画像自体に枠を焼き込む方法がある。後者はリサイズツールでキャンバスサイズを拡張して余白を作る手法で実現できる。角丸と組み合わせると、よりモダンな印象になる。