Customizing Colors and Color Palettes

DigiFlash provides a comprehensive color system that allows you to customize every aspect of your website’s color scheme through the Site Editor Styles panel.

Accessing Color Settings

Navigate to Appearance → Editor and click the Styles icon in the top-right corner. In the Styles panel, click on Colors to access all color customization options.

Understanding the Color Palette

DigiFlash comes with a predefined color palette that includes:

Base Colors – Primary background and text colors used throughout your site

Theme Colors – Brand colors including Primary, Secondary, and Accent

Neutral Colors – Grayscale options for borders, backgrounds, and subtle elements

Semantic Colors – Success, Warning, and Error colors for specific use cases

Each color in the palette displays with its name and a color swatch. Click on any color swatch to modify that specific color.

Changing Individual Colors

To customize a color, click on its color swatch. A color picker appears with several input methods:

Color Wheel – Click and drag to select your desired hue and saturation

Hex Input – Enter a hexadecimal color code directly (e.g., #526bfe)

RGB Sliders – Adjust red, green, and blue values individually

Eyedropper Tool – Sample colors from your screen (browser-dependent feature)

After selecting your new color, the changes apply immediately across your entire website wherever that color is used.

Setting Text and Background Colors

Within the Colors panel, you’ll find separate sections for:

Text Color – Sets the default text color for body content

Background Color – Sets the default background color for your site

Link Color – Defines the color for hyperlinks in their default state

These global color settings override the palette colors and provide quick access to the most frequently adjusted color options.

Using Custom Colors Outside the Palette

When editing colors for specific blocks or elements, you can choose colors outside your defined palette. The color picker always allows custom color selection, giving you complete flexibility even if a color isn’t part of your saved palette.

Creating Color Combinations

DigiFlash automatically ensures proper contrast ratios between text and background colors. When you select a background color, the editor suggests appropriate text colors that maintain readability.

Click on different elements in the preview to see how your color changes affect various parts of your website, including headings, buttons, and content blocks.

Reverting Color Changes

To undo color modifications, click the three-dot menu in the Styles panel and select Reset to defaults. This option appears when you hover over style categories and allows you to revert individual color settings without affecting other customizations.