You know what is Heading and how to use Heading. The dual heading elementor element does the same in a unique way. It has a feature to write a full heading in two sections. You are free to customize each sections Background color, typography, text color.
In this demo, I have used Poppins font and 35px font size. For the first heading, the font width is 400 and for the second it's 600. You are free to align the content in left, center, or right.
Dual Heading Content Area
After dragging the Dual Heading Element inside your elementor page builder you will see the content section. Take a close look at the right side screenshot.
Heading HTML Tag:
Choose the perfect HTML tag like H1,H2, H3, Div, P, Span from this option.
First & Second Heading:
Write your heading content in these two section. Make sure to divide your heading properly because you need to work with the style too.
If you need to put a description then use this section. If you don’t need sub heading then just leave it as blank.
In case if you prefer to showcase icon then just enable the icon part and select your desired icon from the list.
Dual Heading Style
You will see the Style tab beside the content. Just click on the tab and you are now on the styling area. Before explaining, let me show you a Gif file. It will clarify your thoughts about the style property.
Define your style preset and content alignment from this option. There is two types of style available for now. Set the perfect alignment of your content.
Change Text and Background color of your first heading. Also open the typo option to select your font, weight, line height, letter spacing, and some other typo related property.
You will get an exact same option as first heading here too. Just set the value wisely to make an attractive dual heading.
Sometimes you may need to customize your subheading too. That’s why you have configured this panel for you. Change your text color and typography of subheading from here.
Set the Normal and Hover color of your icon.