feat(icons): added square-round-corner icon

[liamb13]

What is the purpose of this pull request?

• New Icon
• Bug fix
• New Feature
• Documentation update
• Other:

Description

Adds a border-radius icon.

Icon use case

This adds a visual representation for border-radius.
Could be useful in a design application to represent corners.
Could also be used as a visual guide for different button properties, e.g; a square or rounded one might use this to indicate what's changing.

Icon Design Checklist

Concept

• I have provided valid use cases for each icon.
• I have not added any a brand or logo icon.
• I have not used any hate symbols.
• I have not included any religious or political imagery.

Author, credits & license

• The icons are solely my own creation.
• The icons were originally created in # by @
• I've based them on the following Lucide icons: box-select and maximize with some subtle tweaks to better suit this icon.
• I've based them on the following design:

Naming

• I've read and followed the naming conventions
• I've named icons by what they are rather than their use case: Alternative name consider was corner-radius, which arguably is a better suit for it's name. But I think if someone were looking for this icon, their search would be border-radius.
• I've provided meta JSON files in icons/[iconName].json.

Design

• I've read and followed the icon design guidelines
• I've made sure that the icons look sharp on low DPI displays.
• I've made sure that the icons look consistent with the icon set in size, optical volume and density.
• I've made sure that the icons are visually centered.
• I've correctly optimized all icons to three points of precision.

Before Submitting

• I've read the Contribution Guidelines.
• I've checked if there was an existing PR that solves the same issue.

[github-actions]

Added or changed icons

Preview cohesion

Preview stroke widths

DPI Preview (24px)

Icon X-rays

Icon Diffs

Icons as code

Works for: lucide-react, lucide-react-native, lucide-preact, lucide-vue-next

const SquareRoundCornerIcon = createLucideIcon('SquareRoundCorner', [
  ["path",{"d":"M21 11a8 8 0 0 0-8-8"}],
  ["path",{"d":"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"}]
])

[jguddas]

What about using box-select as a base?

Open lucide studio

[liamb13]

What about using box-select as a base?

Open lucide studio

I did experiment with a similar design, however, I thought the rounded corners surrounding it (top-left, bottom-left, bottom-right) be a little confusing. Does it imply a different radius for just the 1 corner.

[liamb13]

A slight variation that combines the two:

Open lucide studio

[liamb13]

Another option might be to base it on spline:

Open lucide studio

[jguddas]

Another option might be to base it on spline:

Open lucide studio

That doesn't look like a corner to me.

[github-actions]

This PR is stale because it has been open 45 days with no activity. Remove stale label or comment or this will be closed in 5 days.

[jguddas]

Maybe even better?

Open lucide studio