# Element Sizes

Each text element has its own set of sizes, and the sets differ. This page shows every size of every element side by side, so you can see which classes exist before you use one. A class an element does not have does nothing, and the text stays at its default size.

### Size Grid

Each row is one element and each column is one size name, from smallest to largest. Add the size class next to the element class, as in `value value--large`.

The same size name is a different size on each element: `value--xlarge` is much larger than `title--xlarge`.

| Element | xxsmall | xsmall | small | base | large | xlarge | xxlarge | xxxlarge | mega | giga | tera | peta |
| --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- |
| [Title](/framework/docs/3.4/title) | Not available | Not available | 
Aa`title--small`
 | 
Aa`title--base`
 | 
Aa`title--large`
 | 
Aa`title--xlarge`
 | 
Aa`title--xxlarge`
 | Not available | Not available | Not available | Not available | Not available |
| [Value](/framework/docs/3.4/value) | 
Aa`value--xxsmall`
 | 
Aa`value--xsmall`
 | 
Aa`value--small`
 | 
Aa`value--base`
 | 
Aa`value--large`
 | 
Aa`value--xlarge`
 | 
Aa`value--xxlarge`
 | 
Aa`value--xxxlarge`
 | 
Aa`value--mega`
 | 
Aa`value--giga`
 | 
Aa`value--tera`
 | 
Aa`value--peta`
 |
| [Label](/framework/docs/3.4/label) | Not available | Not available | 
Aa`label--small`
 | 
Aa`label--base`
 | 
Aa`label--large`
 | 
Aa`label--xlarge`
 | 
Aa`label--xxlarge`
 | Not available | Not available | Not available | Not available | Not available |
| [Description](/framework/docs/3.4/description) | Not available | Not available | Not available | 
Aa`description--base`
 | 
Aa`description--large`
 | 
Aa`description--xlarge`
 | 
Aa`description--xxlarge`
 | Not available | Not available | Not available | Not available | Not available |
| [Rich Text](/framework/docs/3.4/rich_text) | Not available | Not available | 
Aa`content--small`
 | 
Aa`content--base`
 | 
Aa`content--large`
 | 
Aa`content--xlarge`
 | 
Aa`content--xxlarge`
 | 
Aa`content--xxxlarge`
 | Not available | Not available | Not available | Not available |
| [Text Size](/framework/docs/3.4/text_size) | Not available | Not available | 
Aa`text--small`
 | 
Aa`text--base`
 | 
Aa`text--large`
 | 
Aa`text--xlarge`
 | 
Aa`text--xxlarge`
 | 
Aa`text--xxxlarge`
 | 
Aa`text--mega`
 | 
Aa`text--giga`
 | 
Aa`text--tera`
 | 
Aa`text--peta`
 |

Every size class also takes the `lg:`, `portrait:`, and `lg:portrait:` prefixes, for example `lg:portrait:value--xlarge`. See [Responsive](/framework/docs/3.4/responsive) .

 Previous  [ 

## Mashup

Assemble multiple plugin views into a single interface

 ](/framework/docs/3.4/mashup)

 Next  [ 

## Title

Style headings with consistent typography

 ](/framework/docs/3.4/title)