The configuration details for this component are described below.

• Title: Defines the first line of text
• Description: Defines and second line of text
  
• Background color: Select background color; options are solid color or gradient
  
• Gradient direction: Sets the direction of the gradient
• Invert gradient: Reverses the direction set above

Good to know:

• Text color can be customized to black, white, gold, gray or any of the brand complementary colors
• Background colors can be set to create a colored block of copy
• Fonts size are in VW units which is a percentage of the browser width. As a result, fonts will resize--as the browser gets wider, the fonts will get bigger, and as the browser gets narrower the fonts will get smaller. This helps maintain the integrity of the text layout across browser widths.
• The AEM tool bar allows you to select multiple font sizes. This can cause unpredictable results. It is recommended that you first de-select a font size before applying another font size.
• Test your composition across various browser widths and select the VW size that provides the most compatible layout.

Tips and tricks

• Text will be centered when using full bleed

Governance

The author is responsible for using the right combination of fonts, colors and background effects that is brand compliant.