Skip to main content

Borders

Utilities to control the borders of the elements

Colors

ClassProperties
border-primaryborder-color: var(--dash-color-primary)
border-secondaryborder-color: var(--dash-color-secondary)
border-whiteborder-color: var(--dash-color-white)
border-blackborder-color: var(--dash-color-black)
border-grayborder-color: var(--dash-color-gray)
border-redborder-color: var(--dash-color-red)
border-orangeborder-color: var(--dash-color-orange)
border-yellowborder-color: var(--dash-color-yellow)
border-greenborder-color: var(--dash-color-green)
border-tealborder-color: var(--dash-color-teal)
border-blueborder-color: var(--dash-color-blue)
border-indigoborder-color: var(--dash-color-indigo)
border-cyanborder-color: var(--dash-color-cyan)
border-purpleborder-color: var(--dash-color-purpl);
border-pinkborder-color: var(--dash-color-pin);

Sizes

ClassProperties
border-xsborder-width: var(--dash-size-xs);
border-smborder-width: var(--dash-size-sm);
border-mdborder-width: var(--dash-size-md);
border-lgborder-width: var(--dash-size-lg);
border-xlborder-width: var(--dash-size-xl);
border-2xlborder-width: var(--dash-size-2xl);
border-3xlborder-width: var(--dash-size-3xl);
border-4xlborder-width: var(--dash-size-4xl);
border-5xlborder-width: var(--dash-size-5xl);
border-6xlborder-width: var(--dash-size-6xl);
border-7xlborder-width: var(--dash-size-7xl);
border-8xlborder-width: var(--dash-size-8xl);
border-9xlborder-width: var(--dash-size-9xl);
border-fullborder-width: var(--dash-size-full);
border-screenborder-width: var(--dash-size-screen);

Style

ClassProperties
border-solidborder-style: solid;
border-dashedborder-style: dashed;
border-dottedborder-style: dotted;
border-doubleborder-style: double;
border-noneborder-style: none;