Skip to main content

Border Radius

Borders

Utilities for controlling the border radius of an element.

ClassProperties
ob-rounded-noneborder-radius: var(--ob-rounded-none)
ob-rounded-smborder-radius: var(--ob-rounded-sm)
ob-rounded-baseborder-radius: var(--ob-rounded-base)
ob-rounded-mdborder-radius: var(--ob-rounded-md)
ob-rounded-lgborder-radius: var(--ob-rounded-lg)
ob-rounded-xlborder-radius: var(--ob-rounded-xl)
ob-rounded-2xlborder-radius: var(--ob-rounded-2xl)
ob-rounded-3xlborder-radius: var(--ob-rounded-3xl)
ob-rounded-fullborder-radius: var(--ob-rounded-full)
ob-rounded-t-noneborder-top-left-radius: var(--ob-rounded-none);
border-top-right-radius: var(ob-rounded-none)
ob-rounded-t-smborder-top-left-radius: var(--ob-rounded-sm);
border-top-right-radius: var(ob-rounded-sm)
ob-rounded-t-baseborder-top-left-radius: var(--ob-rounded-base);
border-top-right-radius: var(ob-rounded-base)
ob-rounded-t-mdborder-top-left-radius: var(--ob-rounded-md);
border-top-right-radius: var(ob-rounded-md)
ob-rounded-t-lgborder-top-left-radius: var(--ob-rounded-lg);
border-top-right-radius: var(ob-rounded-lg)
ob-rounded-t-xlborder-top-left-radius: var(--ob-rounded-xl);
border-top-right-radius: var(ob-rounded-xl)
ob-rounded-t-2xlborder-top-left-radius: var(--ob-rounded-2xl);
border-top-right-radius: var(ob-rounded-2xl)
ob-rounded-t-3xlborder-top-left-radius: var(--ob-rounded-3xl);
border-top-right-radius: var(ob-rounded-3xl)
ob-rounded-t-fullborder-top-left-radius: var(--ob-rounded-full);
border-top-right-radius: var(ob-rounded-full)
ob-rounded-r-noneborder-top-right-radius: var(--ob-rounded-none);
border-bottom-right-radius: var(ob-rounded-none)
ob-rounded-r-smborder-top-right-radius: var(--ob-rounded-sm);
border-bottom-right-radius: var(ob-rounded-sm)
ob-rounded-r-baseborder-top-right-radius: var(--ob-rounded-base);
border-bottom-right-radius: var(ob-rounded-base)
ob-rounded-r-mdborder-top-right-radius: var(--ob-rounded-md);
border-bottom-right-radius: var(ob-rounded-md)
ob-rounded-r-lgborder-top-right-radius: var(--ob-rounded-lg);
border-bottom-right-radius: var(ob-rounded-lg)
ob-rounded-r-xlborder-top-right-radius: var(--ob-rounded-xl);
border-bottom-right-radius: var(ob-rounded-xl)
ob-rounded-r-2xlborder-top-right-radius: var(--ob-rounded-2xl);
border-bottom-right-radius: var(ob-rounded-2xl)
ob-rounded-r-3xlborder-top-right-radius: var(--ob-rounded-3xl);
border-bottom-right-radius: var(ob-rounded-3xl)
ob-rounded-r-fullborder-top-right-radius: var(--ob-rounded-full);
border-bottom-right-radius: var(ob-rounded-full)
ob-rounded-b-noneborder-bottom-right-radius: var(--ob-rounded-none);
border-bottom-left-radius: var(ob-rounded-none)
ob-rounded-b-smborder-bottom-right-radius: var(--ob-rounded-sm);
border-bottom-left-radius: var(ob-rounded-sm)
ob-rounded-b-baseborder-bottom-right-radius: var(--ob-rounded-base);
border-bottom-left-radius: var(ob-rounded-base)
ob-rounded-b-mdborder-bottom-right-radius: var(--ob-rounded-md);
border-bottom-left-radius: var(ob-rounded-md)
ob-rounded-b-lgborder-bottom-right-radius: var(--ob-rounded-lg);
border-bottom-left-radius: var(ob-rounded-lg)
ob-rounded-b-xlborder-bottom-right-radius: var(--ob-rounded-xl);
border-bottom-left-radius: var(ob-rounded-xl)
ob-rounded-b-2xlborder-bottom-right-radius: var(--ob-rounded-2xl);
border-bottom-left-radius: var(ob-rounded-2xl)
ob-rounded-b-3xlborder-bottom-right-radius: var(--ob-rounded-3xl);
border-bottom-left-radius: var(ob-rounded-3xl)
ob-rounded-b-fullborder-bottom-right-radius: var(--ob-rounded-full);
border-bottom-left-radius: var(ob-rounded-full)
ob-rounded-l-noneborder-top-left-radius: var(--ob-rounded-none);
border-bottom-left-radius: var(ob-rounded-none)
ob-rounded-l-smborder-top-left-radius: var(--ob-rounded-sm);
border-bottom-left-radius: var(ob-rounded-sm)
ob-rounded-l-baseborder-top-left-radius: var(--ob-rounded-base);
border-bottom-left-radius: var(ob-rounded-base)
ob-rounded-l-mdborder-top-left-radius: var(--ob-rounded-md);
border-bottom-left-radius: var(ob-rounded-md)
ob-rounded-l-lgborder-top-left-radius: var(--ob-rounded-lg);
border-bottom-left-radius: var(ob-rounded-lg)
ob-rounded-l-xlborder-top-left-radius: var(--ob-rounded-xl);
border-bottom-left-radius: var(ob-rounded-xl)
ob-rounded-l-2xlborder-top-left-radius: var(--ob-rounded-2xl);
border-bottom-left-radius: var(ob-rounded-2xl)
ob-rounded-l-3xlborder-top-left-radius: var(--ob-rounded-3xl);
border-bottom-left-radius: var(ob-rounded-3xl)
ob-rounded-l-fullborder-top-left-radius: var(--ob-rounded-full);
border-bottom-left-radius: var(ob-rounded-full)