Border Radius


Border Radius by Pixel (jds-radius + xxs, xs, s, m, l, xl, xxl, and max)

For style Border Radius, you should use some CSS class .jds-radius-s

Use CSS class .jds-radius-non, or .jds-radius-0 for reset/remove border Radius.


jds-radius-xxs
jds-radius-xs
jds-radius-s
jds-radius-m
jds-radius-l
jds-radius-xl
jds-radius-xxl
jds-radius-max



Radius in Different corner with pixel

For style Border Radius in Different corner you should use some CSS class jds-top-left-radius-xl. You can use multiple class here


jds-top-left-radius-s
jds-bottom-left-radius-m
jds-bottom-right-radius-xxl
jds-top-left-radius-xxl jds-bottom-right-radius-xxl
jds-top-left-radius-xxl jds-top-right-radius-xxl
jds-bottom-left-radius-l jds-bottom-right-radius-xxl
jds-top-right-radius-xxl jds-bottom-left-radius-xxl jds-bottom-right-radius-xxl



Border Radius using Percentage (jds-radius + xxs, xs, s, m, l, xl, xxl)

Radius in Percentage volume. Here you can set a css class for all corner, Like :- .jds-radius-50p


jds-radius-2p
jds-radius-4p
jds-radius-8p
jds-radius-16p
jds-radius-32p
jds-radius-50p