https://github.com/kirevdokimov/unity-ui-rounded-corners

These components and shaders allow you to add rounded corners to UI elements!
https://github.com/kirevdokimov/unity-ui-rounded-corners

c-sharp cg hlsl shader shaderlab ui unity

Last synced: 2 days ago
JSON representation

These components and shaders allow you to add rounded corners to UI elements!

• Host: GitHub
• URL: https://github.com/kirevdokimov/unity-ui-rounded-corners
• Owner: kirevdokimov
• License: mit
• Created: 2019-03-03T15:19:42.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2024-11-19T13:23:02.000Z (2 months ago)
• Last Synced: 2025-01-18T15:49:25.914Z (3 days ago)
• Topics: c-sharp, cg, hlsl, shader, shaderlab, ui, unity
• Language: C#
• Homepage:
• Size: 4.28 MB
• Stars: 1,471
• Watchers: 23
• Forks: 125
• Open Issues: 18
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Unity-UI-Rounded-Corners

These components and shaders allow you to add rounded corners to UI elements!

---

![](title.gif)

## How to install

### Option 1: Package Manager (Unity 2019.3 and higher)

![](how-to-install.gif)

URL to copypaste: 

```

https://github.com/kirevdokimov/Unity-UI-Rounded-Corners.git

```

### Option 2: Package Manager (Manual)

- Open `%projectname%/Packages/manifest.json`

- Add the following to the dependencies section:

```

"com.nobi.roundedcorners": "https://github.com/kirevdokimov/Unity-UI-Rounded-Corners.git"

```

## How to use

#### Symmetrical roundness

- Add `ImageWithRoundedCorners` component to a GameObject with an `Image`

- Adjust `Radius` property

#### Certain roundness value for each corner

- Add `ImageWithIndependentRoundedCorners` to a GameObject with an `Image`

- Adjust `r` Vector4 property. Each vector component represent radius, clockwise, starting with top-left corner

#### Important thing

If you need to add or change the image at runtime, call `Validate()` and then `Refresh()` to update the materials.

# Features

## Changing roundness separately or all at once

![](separate-roundness.gif)

## Keeps round while resizing

![](gif-01.gif)

## Better quality than sprites

![](image-00.png)

## Supports Unity Mask

![](gif-02.gif)

## Supports Tint

![](gif-04.gif)