feat(icons): add square-dimensions (#4547)

* feat(icons): add aspect-ratio

Adds an aspect-ratio icon: a frame with two opposing corner brackets,
depicting the proportions of a frame rather than the frame itself.

Distinct from ratio, which is two overlapping rects showing portrait and
landscape orientation, and from the scan / minimize / maximize family,
which use four corner brackets rather than two.

* feat(icons): rename aspect-ratio to square-dimensions

Per review on #4547 (@karsa-mistmere, @ericfennis): the primary shape is
a square, so it takes the square-<x> name, and square-dimensions reads
more naturally for setting width/height than the ratio-specific
aspect-ratio. Retunes tags and use-cases toward size/dimensions.

* Update icons/square-dimensions.json

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update icons/square-dimensions.json

---------

Co-authored-by: Eric Fennis <eric.fennis@gmail.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: Karsa <contact@karsa.org>
This commit is contained in:
Samuel Alake
2026-08-18 04:33:59 -07:00
committed by GitHub
parent f9d8161e6a
commit c5b33f81f8
2 changed files with 46 additions and 0 deletions

View File

@@ -0,0 +1,31 @@
{
"$schema": "../icon.schema.json",
"contributors": [
"samuelalake"
],
"use-cases": [
"setting or displaying the width and height of a frame or object",
"a size or dimensions control in a design or layout editor",
"indicating fixed-size mode for an element",
"representing artboard or canvas size settings",
"labeling size presets or templates in a design system"
],
"tags": [
"ratio",
"size",
"width",
"height",
"resize",
"scale",
"frame",
"proportions",
"aspect",
"bounds",
"measurements",
"canvas"
],
"categories": [
"design",
"layout"
]
}

View File

@@ -0,0 +1,15 @@
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<rect width="18" height="18" x="3" y="3" rx="2" />
<path d="M12 7H7v5" />
<path d="M12 17h5v-5" />
</svg>

After

Width:  |  Height:  |  Size: 313 B