Start Here

Introduction

Download

Syntax

Core Concepts

Aspect Ratio

Border Radius

Border Size

Border Style

Cursor

Display

Flex

Flex Alignment

Flex Direction

Flex Grow

Flex Position

Flex Size

Flex Width

Font

Gap

Height

Margin

Padding

Spacing

Width

UI Effects

Animations

Single Box

Multi Box

3D Box

Other

Box Shadows

OutSet Shadow

InSet Shadow

Text Shadow

OutSet Shadow

InSet Shadow

UI Widgets

Accordion

Buttons

Calendar

Card

Checks & Radio

Data Tables

DropDown

DropDown Multi Select

Gallery

Pagination

Pop-Up

Progress Bar

Skeleton

Spinners

Suggestion

Tabs

Toasts

Slider

Text Boxes

Text Editor

Tool Tip

Icons

Theme Color Shade

Color Shade

Text Color

Background Color

Border Color

Gradient

Text Gradient

Single Color

Double Color

Triple Color

Background Gradient

Single Color

Double Color

Triple Color

Border Gradient

Single Color

Double Color

Triple Color

Other Pages

Landing Pages

Top Nav 1

Top Nav 2

Side Nav 1

Forget Password

Apps

Add Data

Nav First Level

Nav Second Level

Nav Third Level

N
A
V

Border Color

Enhance Borders with Perfect Shades

Our border color shades allow you to define elements with precision and style. Whether you need subtle borders for a clean look or bold edges for emphasis, these shades provide the perfect visual enhancement.

Key Features:

Fully Customizable: Adjust border shades effortlessly to complement your brand’s design.
Consistent Across Devices: Ensures uniform border rendering on all screen sizes and resolutions.
Predefined Color Schemes: Choose from expertly designed border palettes or create your own.
Easy Integration: Apply dynamic border colors with minimal effort.
Cross-Browser Compatibility: Guarantees a seamless visual experience across all major browsers.

Border Color Red

Class	Color Code	Example
CrBrRd10Lt	`hsla(var(--CrRdH) 100% 10%)`	CrBrRd10Lt
CrBrRd20Lt	`hsla(var(--CrRdH) 100% 20%)`	CrBrRd20Lt
CrBrRd30Lt	`hsla(var(--CrRdH) 100% 30%)`	CrBrRd30Lt
CrBrRd40Lt	`hsla(var(--CrRdH) 100% 40%)`	CrBrRd40Lt
CrBrRd50Lt	`hsla(var(--CrRdH) 100% 50%)`	CrBrRd50Lt
CrBrRd60Lt	`hsla(var(--CrRdH) 100% 60%)`	CrBrRd60Lt
CrBrRd70Lt	`hsla(var(--CrRdH) 100% 70%)`	CrBrRd70Lt
CrBrRd80Lt	`hsla(var(--CrRdH) 100% 80%)`	CrBrRd80Lt

Border Color Yellow

Class	Color Code	Example
CrBrYw10Lt	`hsla(var(--CrYwH) 100% 10%)`	CrBrYw10Lt
CrBrYw20Lt	`hsla(var(--CrYwH) 100% 20%)`	CrBrYw20Lt
CrBrYw30Lt	`hsla(var(--CrYwH) 100% 30%)`	CrBrYw30Lt
CrBrYw40Lt	`hsla(var(--CrYwH) 100% 40%)`	CrBrYw40Lt
CrBrYw50Lt	`hsla(var(--CrYwH) 100% 50%)`	CrBrYw50Lt
CrBrYw60Lt	`hsla(var(--CrYwH) 100% 60%)`	CrBrYw60Lt
CrBrYw70Lt	`hsla(var(--CrYwH) 100% 70%)`	CrBrYw70Lt
CrBrYw80Lt	`hsla(var(--CrYwH) 100% 80%)`	CrBrYw80Lt

Border Color Orange

Class	Color Code	Example
CrBrOe10Lt	`hsla(var(--CrOeH) 100% 10%)`	CrBrOe10Lt
CrBrOe20Lt	`hsla(var(--CrOeH) 100% 20%)`	CrBrOe20Lt
CrBrOe30Lt	`hsla(var(--CrOeH) 100% 30%)`	CrBrOe30Lt
CrBrOe40Lt	`hsla(var(--CrOeH) 100% 40%)`	CrBrOe40Lt
CrBrOe50Lt	`hsla(var(--CrOeH) 100% 50%)`	CrBrOe50Lt
CrBrOe60Lt	`hsla(var(--CrOeH) 100% 60%)`	CrBrOe60Lt
CrBrOe70Lt	`hsla(var(--CrOeH) 100% 70%)`	CrBrOe70Lt
CrBrOe80Lt	`hsla(var(--CrOeH) 100% 80%)`	CrBrOe80Lt

Border Color Blue

Class	Color Code	Example
CrBrBe10Lt	`hsla(var(--CrBeH) 100% 10%)`	CrBrBe10Lt
CrBrBe20Lt	`hsla(var(--CrBeH) 100% 20%)`	CrBrBe20Lt
CrBrBe30Lt	`hsla(var(--CrBeH) 100% 30%)`	CrBrBe30Lt
CrBrBe40Lt	`hsla(var(--CrBeH) 100% 40%)`	CrBrBe40Lt
CrBrBe50Lt	`hsla(var(--CrBeH) 100% 50%)`	CrBrBe50Lt
CrBrBe60Lt	`hsla(var(--CrBeH) 100% 60%)`	CrBrBe60Lt
CrBrBe70Lt	`hsla(var(--CrBeH) 100% 70%)`	CrBrBe70Lt
CrBrBe80Lt	`hsla(var(--CrBeH) 100% 80%)`	CrBrBe80Lt

Border Color Green

Class	Color Code	Example
CrBrGn10Lt	`hsla(var(--CrGnH) 100% 10%)`	CrBrGn10Lt
CrBrGn20Lt	`hsla(var(--CrGnH) 100% 20%)`	CrBrGn20Lt
CrBrGn30Lt	`hsla(var(--CrGnH) 100% 30%)`	CrBrGn30Lt
CrBrGn40Lt	`hsla(var(--CrGnH) 100% 40%)`	CrBrGn40Lt
CrBrGn50Lt	`hsla(var(--CrGnH) 100% 50%)`	CrBrGn50Lt
CrBrGn60Lt	`hsla(var(--CrGnH) 100% 60%)`	CrBrGn60Lt
CrBrGn70Lt	`hsla(var(--CrGnH) 100% 70%)`	CrBrGn70Lt
CrBrGn80Lt	`hsla(var(--CrGnH) 100% 80%)`	CrBrGn80Lt

Border Color Pink

Class	Color Code	Example
CrBrPk10Lt	`hsla(var(--CrPkH) 100% 10%)`	CrBrPk10Lt
CrBrPk20Lt	`hsla(var(--CrPkH) 100% 20%)`	CrBrPk20Lt
CrBrPk30Lt	`hsla(var(--CrPkH) 100% 30%)`	CrBrPk30Lt
CrBrPk40Lt	`hsla(var(--CrPkH) 100% 40%)`	CrBrPk40Lt
CrBrPk50Lt	`hsla(var(--CrPkH) 100% 50%)`	CrBrPk50Lt
CrBrPk60Lt	`hsla(var(--CrPkH) 100% 60%)`	CrBrPk60Lt
CrBrPk70Lt	`hsla(var(--CrPkH) 100% 70%)`	CrBrPk70Lt
CrBrPk80Lt	`hsla(var(--CrPkH) 100% 80%)`	CrBrPk80Lt

Border Color Purple

Class	Color Code	Example
CrBrPe10Lt	`hsla(var(--CrPeH) 100% 10%)`	CrBrPe10Lt
CrBrPe20Lt	`hsla(var(--CrPeH) 100% 20%)`	CrBrPe20Lt
CrBrPe30Lt	`hsla(var(--CrPeH) 100% 30%)`	CrBrPe30Lt
CrBrPe40Lt	`hsla(var(--CrPeH) 100% 40%)`	CrBrPe40Lt
CrBrPe50Lt	`hsla(var(--CrPeH) 100% 50%)`	CrBrPe50Lt
CrBrPe60Lt	`hsla(var(--CrPeH) 100% 60%)`	CrBrPe60Lt
CrBrPe70Lt	`hsla(var(--CrPeH) 100% 70%)`	CrBrPe70Lt
CrBrPe80Lt	`hsla(var(--CrPeH) 100% 80%)`	CrBrPe80Lt

Border Color Gray

Class	Color Code	Example
CrBrGy10Lt	`hsla(var(--CrGyH) 0% 10%)`	CrBrGy10Lt
CrBrGy20Lt	`hsla(var(--CrGyH) 0% 20%)`	CrBrGy20Lt
CrBrGy30Lt	`hsla(var(--CrGyH) 0% 30%)`	CrBrGy30Lt
CrBrGy40Lt	`hsla(var(--CrGyH) 0% 40%)`	CrBrGy40Lt
CrBrGy50Lt	`hsla(var(--CrGyH) 0% 50%)`	CrBrGy50Lt
CrBrGy60Lt	`hsla(var(--CrGyH) 0% 60%)`	CrBrGy60Lt
CrBrGy70Lt	`hsla(var(--CrGyH) 0% 70%)`	CrBrGy70Lt
CrBrGy80Lt	`hsla(var(--CrGyH) 0% 80%)`	CrBrGy80Lt

Border Color Black

Class Name	Color Shades	Example
CrBrBk	`hsla(var(--CrBkH) 0% 0%)`	CrBrBk

Border Color White

Class Name	Color Shades	Example
CrBrWe	`hsla(var(--CrWeH) 0% 100%)`	CrBrWe

Web Tool

Welcome Amit

Logout

Change Password

Change Email