REA Dual Color Header

REA Dual Color Header Widget allows you to create an eye-catching header with dual colors to create an interactive look for your audience.

Content

Content Settings

  1. 1.
    Content Style - You can select the content style to show the icon and text.
  2. 2.
    Show Icon - You can toggle between show/hide for the icon.
  3. 3.
    Show Separator - You can toggle between show/hide for the separator.
  4. 4.
    Icon - You can select icon from the icons library.
  5. 5.
    Title tag - You can select title tag such as H1, H2, H3, and so on.
  6. 6.
    Title ( First Part ) - Dual color heading is split into 2 parts, you can set the text for the first part.
  7. 7.
    Title ( Last Part ) - Dual color heading is split into 2 parts, you can set the text for the last part.
  8. 8.
    Subtext - You can add a subtext for the heading.
  9. 9.
    Alignment - You can set the alignment for the text.

Separator

  1. 1.
    Separator Position - You can choose the position for the separator to show before or after the title.
  2. 2.
    Separator Type - You can select the type of Separator - Line or Icon.

Style

Dual Heading Style

  1. 1.
    Background color - You can set the background color for the dual color header block.
  2. 2.
    Padding & Margin - You can set the padding and margin to the dual-color header block.
  3. 3.
    Border Type - You can set the border style, width, color, and radius.
  4. 4.
    Box Shadow - You can set the box-shadow to the dual-color header box.

Icon Style

  1. 1.
    Icon Size - You can adjust the size of the icon.
  2. 2.
    Icon color - You can choose the color of the icon.

Color & Typography

  1. 1.
    Title
    1. 1.
      Main Color - You can choose the color of the last text.
    2. 2.
      Dual color - You can choose the color of the first text to be a solid color or a gradient.
    3. 3.
      Typography - You can set the typography for text such as font-size, font family etc.
  2. 2.
    Subtitle
    1. 1.
      Color - You can choose the color of the sub text.
    2. 2.
      Typography - You can set the typography for subtitle such as font-size, font family etc.

Separator

  1. 1.
    Alignment - You can set the alignment to the separator.
  2. 2.
    Distance Between Lines - You can set the distance between the separator lines.
  3. 3.
    Margin - You can set the margin to the separator.
  4. 4.
    Width - You can set the width to the separator for the left and right line.
  5. 5.
    Height - You can set the height to the separator for the left and right line.
  6. 6.
    Radius - You can set the border radius to the separator.
  7. 7.
    Background Type - You can set the background color (solid as well as gradient) or image to the separator left and right line.