x
1
2
3
4
5
6
<h2 class="mb-4 text-gray-900 dark:text-white text-4xl font-bold md:text-5xl lg:text-6xl tracking-tight leading-none">Line Height: none</h2>
<h2 class="mb-4 text-gray-900 dark:text-white text-4xl font-bold md:text-5xl lg:text-6xl tracking-tight leading-tight">Line Height: tight</h2>
<h2 class="mb-4 text-gray-900 dark:text-white text-4xl font-bold md:text-5xl lg:text-6xl tracking-tight leading-snug">Line Height: snug</h2>
<h2 class="mb-4 text-gray-900 dark:text-white text-4xl font-bold md:text-5xl lg:text-6xl tracking-tight leading-normal">Line Height: normal</h2>
<h2 class="mb-4 text-gray-900 dark:text-white text-4xl font-bold md:text-5xl lg:text-6xl tracking-tight leading-relaxed">Line Height: relaxed</h2>
<h2 class="mb-4 text-gray-900 dark:text-white text-4xl font-bold md:text-5xl lg:text-6xl tracking-tight leading-loose">Line Height: loose</h2>
1
2
3
<% Fluxbit::Config::HeadingComponent.styles[:line_heights].keys.each do |line_height| %>
<%= fx_heading(size: 2, spacing: :tight, line_height: line_height, with_content: "Line Height: #{line_height}") %>
<% end %>