> For the complete documentation index, see [llms.txt](https://docs.stylothemes.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.stylothemes.com/urdupress/customization/typography/headings.md).

# Headings

### Headings

Control the look of your headings (H1–H6 tags).

* **H1** – Used for main titles.
* **H2** – Section headings.
* **H3–H6** – Subheadings or smaller titles.

For each heading level, you can:

* Select the **font family**
* Adjust the **size**
* Change **line height** and **spacing**
* Apply **uppercase, lowercase, or capitalize** styling

***

### Body Text

Manage the typography of your main content paragraphs.

* Choose the font family
* Adjust font size for better readability
* Set line height for comfortable spacing

### Widget Content

Customize the appearance of the actual widget content (e.g., list items, descriptions):

* Same controls as “Widget Headings” — choose font family, size, color, alignment, and spacing.

***

### How Font Selection Works (Using Kirki Typography Control)

When you open the Typography control in the Customizer:

1. **Font Family Dropdown** – Lists available fonts, including Google Fonts and system fonts.
2. **Live Preview** – As you change values (font family, size, etc.), you can see updates in real time.
3. **Performance Optimization** – Only activated fonts are loaded on your site, ensuring speed and efficiency .
4. **Single Panel Experience** – Kirki groups all typography options (font, size, spacing, color, alignment) into one clean control view.

***

### Tips

💡 Use no more than 2–3 fonts to keep your website design clean.\
💡 Larger line-height improves readability for body text.\
💡 Consistent heading styles make your content easier to scan.

{% embed url="<https://youtu.be/FsYrRLQ2eVk>" %}
