GitHub

Borders

Border styles and utility CSS classes.

Border radius link

Use these CSS classes to set border-radius to an element e.g. class="rz-border-radius-6".

Border-radius value CSS class CSS variable
theme specific .rz-border-radius --rz-border-radius
0 .rz-border-radius-0 --rz-border-radius-0
0.25rem .rz-border-radius-1 --rz-border-radius-1
0.5rem .rz-border-radius-2 --rz-border-radius-2
0.75rem .rz-border-radius-3 --rz-border-radius-3
1rem .rz-border-radius-4 --rz-border-radius-4
1.25rem .rz-border-radius-5 --rz-border-radius-5
1.5rem .rz-border-radius-6 --rz-border-radius-6
1.75rem .rz-border-radius-7 --rz-border-radius-7
2rem .rz-border-radius-8 --rz-border-radius-8
2.25rem .rz-border-radius-9 --rz-border-radius-9
2.5rem .rz-border-radius-10 --rz-border-radius-10

Border utility CSS classes link

The following CSS classes add 1px solid border with its respective color. E.g. class="rz-border-primary".

.rz-border-white
.rz-border-base-50
.rz-border-base-100
.rz-border-base-200
.rz-border-base-300
.rz-border-base-400
.rz-border-base-500
.rz-border-base-600
.rz-border-base-700
.rz-border-base-800
.rz-border-base-900
.rz-border-black
.rz-border-primary-lighter
.rz-border-primary-light
.rz-border-primary
.rz-border-primary-dark
.rz-border-primary-darker
.rz-border-secondary-lighter
.rz-border-secondary-light
.rz-border-secondary
.rz-border-secondary-dark
.rz-border-secondary-darker
.rz-border-info-lighter
.rz-border-info-light
.rz-border-info
.rz-border-info-dark
.rz-border-info-darker
.rz-border-success-lighter
.rz-border-success-light
.rz-border-success
.rz-border-success-dark
.rz-border-success-darker
.rz-border-warning-lighter
.rz-border-warning-light
.rz-border-warning
.rz-border-warning-dark
.rz-border-warning-darker
.rz-border-danger-lighter
.rz-border-danger-light
.rz-border-danger
.rz-border-danger-dark
.rz-border-danger-darker

Borders with CSS variables link

Use theme color variables when defining borders. See theme colors

style="border: 10px dotted var(--rz-success)"

Introducing Radzen Blazor Studio

Radzen Blazor Studio is a desktop tool that empowers developers to create beautiful business Blazor apps. Develop your Blazor Server and WebAssembly applications visually with familiar WYSIWYG interface.


Source Code licensed under MIT

New

Radzen
Blazor Studio

Radzen Blazor Studio is a desktop tool that empowers developers to create beautiful Blazor apps.

Develop your Blazor Server and WebAssembly applications visually with familiar WYSIWYG interface.

An error has occurred. This application may no longer respond until reloaded. Reload 🗙