Ratio Pixel Art Icon
A ratio icon for aspect-ratio selectors, image-crop presets, viewport size controls, and responsive design settings.
Style variants
base
Outline · rounded corners
Base, sharp, solid or glyph: see how the four styles differ and which to use.
About the Ratio icon
Two rectangles or a divided frame showing a proportional relationship, representing the ratio between two dimensions. Photo editors use it in crop tool presets (16:9, 4:3, 1:1); responsive design tools use it near breakpoint and viewport controls. It differs from the proportions icon in that ratio typically implies a specific named fraction rather than a general scale relationship. When you need to lock a proportion rather than select a named ratio, proportions is the better label.
Usage
<!-- HTML -->
<img src="pixelarticons/svg/ratio.svg" width="24" height="24" alt="Ratio" />
<!-- React -->
import { Ratio } from 'pixelarticons/react'
<!-- Sizes: 24px, 48px, 72px, 96px (multiples of 24) -->
<img src="ratio.svg" width="48" height="48" style="image-rendering: pixelated" />