Custom Color Editing Guide

File Location:

folder/css/custom/custom-color.css

Sections to Update:

Primary Color:

To change the primary color, update the value of --primary-color variable:

:root {
  --primary-color: #2371d8;
}

Secondary Color:

Modify the secondary color by editing the value of --secondary-color variable:

:root {
  --secondary-color: #6aa8fa;
}

Tertiary Color:

Adjust the tertiary color by changing the value of --tertiary-color variable:

:root {
  --tertiary-color: #1546e6;
}

Body Colors:

Edit the body colors by modifying --bg-dark-1, --bg-dark-2, and --dark-body-font-color variables:

:root {
  --bg-dark-1: #00070e;
  --bg-dark-2: #00060a;
  --dark-body-font-color: #e3f1ff;
}

Other Text Color:

To adjust the gradient text color, update the value of --gradient-text variable:

:root {
  --gradient-text: 90deg, #d7e7ff 0%, #ffffff 75%;
}

Main Text Color:

Modify the main text color by editing the linear gradient definition for --main-text-color variable:

:root {
  --main-text-color: linear-gradient(0deg, rgb(109, 189, 255) 0%, rgba(255,255,255,1) 100%);
}

Final Steps:

Save Your Changes: After updating the CSS file, save your changes.

Verify Updates: Open your website and ensure that the colors are displayed correctly.

Test Responsiveness: Check the responsiveness of your website to ensure that the color changes look good on different devices and screen sizes.