---
metaTitle: Title component | AwesCode UI
meta:
  - name: description
    content: The <AwTitle /> component is used to render Title - UI Vue component for AwesCode UI.
title: Title
---

# Title

**Category:** Atom | **Import:** Global

The `AwTitle` component is a semantic title wrapper with consistent styling.

## Overview

`AwTitle` provides a styled title component that can render as different HTML heading tags (h1-h6). It applies consistent typography and spacing for page or section titles.

## Usage

### Basic Example

```markup
<AwTitle>Page Title</AwTitle>
```

### With Custom Tag

```markup
<AwTitle tag="h1">Main Title</AwTitle>
```

### Different Heading Levels

```markup
<AwTitle tag="h1">Level 1 Title</AwTitle>
<AwTitle tag="h2">Level 2 Title</AwTitle>
```

## API

### Props

| Name | Description | Type | Required | Default |
|------|-------------|------|----------|---------|
| tag | HTML heading tag (h1-h6) | `String` | `false` | `'h2'` |

### Slots

| Name | Description | Props | Default Slot Content |
|------|-------------|-------|---------------------|
| default | Title text content | - | - |

### Events

No events are emitted by this component.

## Related Components

- `AwHeadline` - Headline component
- `AwSubHeadline` - Sub-headline component
- `AwPage` - Page component that uses titles

## Notes

- **Import Method:** Global - Available as atom component
- Default tag is `h2`
- Use for page titles and main section headings
- Maintains semantic HTML structure with appropriate heading levels