a
This commit is contained in:
@@ -0,0 +1,58 @@
|
||||
---
|
||||
title: Text
|
||||
description: Show your texts in different styles. 💅
|
||||
lastUpdated: 09 Sep, 2025
|
||||
links:
|
||||
source: https://github.com/logging-studio/RetroUI/blob/main/components/retroui/Text.tsx
|
||||
---
|
||||
|
||||
## Headings
|
||||
|
||||
The `Text` component is a versatile React component that provides various heading styles. It leverages class-variance-authority for managing variants and allows for the customization of heading elements.
|
||||
|
||||
<hr />
|
||||
<br />
|
||||
|
||||
<ComponentShowcase name="text-headings" />
|
||||
<br />
|
||||
|
||||
#### Props
|
||||
|
||||
`className`: Additional CSS classes to customize the component's styling.
|
||||
|
||||
<br />
|
||||
|
||||
`as`: Determines the heading and text style. Default is `p`. Variants include:
|
||||
|
||||
- `"h1", "h2", "h3", "h4", "h5", "h6", "p"`
|
||||
|
||||
<br />
|
||||
<br />
|
||||
|
||||
## Installation
|
||||
|
||||
<ComponentInstall>
|
||||
<ComponentInstall.Cli npmCommand="npx shadcn@latest add @retroui/text" />
|
||||
<ComponentInstall.Manual>
|
||||
|
||||
#### 1. Install dependencies:
|
||||
|
||||
```sh
|
||||
npm install class-variance-authority
|
||||
```
|
||||
|
||||
<br />
|
||||
|
||||
#### 2. Copy the code 👇 into your project:
|
||||
|
||||
<ComponentSource name="text" />
|
||||
|
||||
</ComponentInstall.Manual>
|
||||
</ComponentInstall>
|
||||
|
||||
<br />
|
||||
<br />
|
||||
|
||||
## Paragraph
|
||||
|
||||
<ComponentShowcase name="typography-p" />
|
||||
Reference in New Issue
Block a user