Typography
Display text using pre-defined typographic styles and style combinations.
#Heading
#
The Evil Rabbit Jumps.
The Evil Rabbit Jumps.
<x-heading :as-heading="false">The Evil Rabbit Jumps.</x-heading>
<x-paragraph style="muted">The Evil Rabbit Jumps.</x-paragraph>
#Paragraph
#
The Evil Rabbit Jumped over the Fence.
<x-paragraph>
The Evil Rabbit Jumped over the Fence.
</x-paragraph>
#Muted
#
The Evil Rabbit Jumped over the Fence.
<x-paragraph style="muted">
The Evil Rabbit Jumped over the Fence.
</x-paragraph>
#Description
#
Displays a brief heading and subheading for additional information or context.
- Section Title
- Description about this section.
<x-description>
<x-slot:title>
Section Title
</x-slot:title>
Description about this section.
</x-description>
#Currency
#
€100.00
<x-currency :value="100.00" />
#Date Time
#
Aug 27, 2026 — 19:11
<x-date-time :date="\Carbon\Carbon::now()" />
#Unordered List
#
- The Evil Rabbit Jumped over the Fence.
- The Evil Rabbit Jumped over the Fence.
- The Evil Rabbit Jumped over the Fence.
- The Evil Rabbit Jumped over the Fence.
<x-ul>
<li>The Evil Rabbit Jumped over the Fence.</li>
<li>The Evil Rabbit Jumped over the Fence.</li>
<li>The Evil Rabbit Jumped over the Fence.</li>
<li>The Evil Rabbit Jumped over the Fence.</li>
</x-ul>
#Ordered List
#
- The Evil Rabbit Jumped over the Fence.
- The Evil Rabbit Jumped over the Fence.
- The Evil Rabbit Jumped over the Fence.
- The Evil Rabbit Jumped over the Fence.
<x-ol>
<li>The Evil Rabbit Jumped over the Fence.</li>
<li>The Evil Rabbit Jumped over the Fence.</li>
<li>The Evil Rabbit Jumped over the Fence.</li>
<li>The Evil Rabbit Jumped over the Fence.</li>
</x-ol>
#Codeblock
#
composer require ddfsn/blade-components
<x-pre>composer require ddfsn/blade-components</x-pre>