Color swatch

Rapido uses Dynamicweb's color swatch (Figure 1.1) which is able to suggest color palettes based on:

  • Manually picked colors
  • Colors from an image
  • An imported file with color codes (business palette)

The color swatch is used in the website settings (e.g. when selecting brand colors) and in content setup (e.g. paragraph container color settings).

Figure 1.1 The color swatch in Rapido

For each color swatch, you have following:

  1. Your five brand colors (hover over any of these to pick from five different shades of that color (Figure 1.2))
  2. Five neutral colors
  3. A color picker where you can select any color
  4. Transparent option
  5. A pencil icon to open more advanced color settings
Figure 1.2 For each brand color you can select a shade

If you click the pencil icon, you will gain access to the advanced color settings (Figure 1.3). Here you can get suggested brand colors on the left side and suggested neutral colors (based on a brand color) on the right side.

Read more about these settings below.

Figure 1.3 Advanced color settings

NB: These settings will affect ALL color swatches both in website settings and in content setup!

Clicking the pencil icon opens the Select colors interface with more advanced color settings (Figure 2.2). Here you can generate suggested brand colors on the left side and suggested neutral colors (based on a brand color) on the right side - it is also possible to override each generated color manually.

Let's start with the suggested brand colors (left side). You can choose between three different methods (Figure 2.2):

  • Color guide
  • Based on image
  • Business palette
Figure 2.2 The methods to render brand color suggestions

Selecting color guide (Figure 3.1), you set a base color and can then choose between the following palette options:

  • Analogous (rainbow pattern)
  • Monochromatic
  • Triad (suggestions based on the RGB or CMY triad)
  • Complementary
  • Compound
  • Shades
Figure 3.1 The color guide option

Selecting based on image (Figure 3.2), you select an image and will then get suggested brand colors based on that image.

Figure 3.2 The based on image option

Selecting business palette (Figure 3.3), you can choose between predefined color themes in Dynamicweb where you can select a type and then a specific palette for this type.

Figure 3.3 The business palette option

On the right side, you can get suggestions on the neutral colors (Figure 4.1). Select a brand color as the base and you will get a palette of five suggested neutral colors based on the brand color.