# Heading & Text

> Typography components for email — headings h1-h6 and paragraph text.

**Site index:** [https://email.2plot.dev/llms.txt](https://email.2plot.dev/llms.txt) — every page on this site, as Markdown.  
**Network index:** [https://2plot.dev/llms.txt](https://2plot.dev/llms.txt) — The 2plot network; start here to discover sibling sites.  
**Sibling sites:** 13 more in The 2plot network — listed in the site index above.  
**Sitemap:** https://email.2plot.dev/sitemap.xml  


---



### Typography

`EmailHeading` renders `h1`–`h6` elements via the `as_` prop; `EmailText`
renders paragraphs. Both take inline styles through the `style` prop.


    `as` is a reserved word in Python, so the prop is exposed as `as_` —
    the same convention Dash uses for `class` → `className`.


Source code:


```python
# File: docs/heading-text/heading_text.py

import dash_email as de

component = de.Email([
    de.EmailBody(
        style={"backgroundColor": "#f6f9fc", "padding": "32px 0"},
        children=[
            de.EmailContainer([
                de.EmailSection(
                    style={
                        "backgroundColor": "#ffffff",
                        "borderRadius": "8px",
                        "padding": "32px",
                    },
                    children=[
                        de.EmailHeading("Heading level h1", as_="h1"),
                        de.EmailHeading("Heading level h2", as_="h2"),
                        de.EmailHeading(
                            "Styled h3 heading",
                            as_="h3",
                            style={"color": "#228be6", "letterSpacing": "1px"},
                        ),
                        de.EmailText(
                            "EmailText renders paragraph copy. Use the style "
                            "prop for color, size, and line height — all "
                            "rendered inline for email-client safety.",
                            style={"color": "#495057", "lineHeight": "1.7"},
                        ),
                        de.EmailText(
                            "Small, muted footnote text.",
                            style={"color": "#999999", "fontSize": "12px"},
                        ),
                    ],
                )
            ])
        ],
    )
])
```


---

### EmailHeading


**EmailHeading**

| Name | Type | Description |
| --- | --- | --- |
| children | a list of or a singular dash component, string or number; optional | The heading text content. |
| id | string; optional | The ID used to identify this component in Dash callbacks. |
| as_ | a value equal to: 'h1', 'h2', 'h3', 'h4', 'h5', 'h6'; default 'h1' | The heading level (h1, h2, h3, h4, h5, h6). |


---

### EmailText


**EmailText**

| Name | Type | Description |
| --- | --- | --- |
| children | a list of or a singular dash component, string or number; optional | The text content. |
| id | string; optional | The ID used to identify this component in Dash callbacks. |


---

*Source: /components/heading-text*
