## Text ribbons

Create culti-line, inline ribbons on your text. Useful for breaking up content and adding strong visual flourishes.

{% example html %}
<h2 class="mt-0">
  <strong class="text-ribbon text-ribbon-primary">
    <span>Gucci Flip flops</span>
  </strong>
</h2>
<p class="mt-4">
  <span class="text-ribbon text-ribbon-primary">
    <span>Aenean lacinia bibendum nulla sed consectetur. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Curabitur blandit tempus porttitor.</span>
  </span>
</p>

<h2 class="mt-5">
  <strong class="text-ribbon text-ribbon-success">
    <span>Gucci Flip flops</span>
  </strong>
</h2>
<p class="mt-4">
  <span class="text-ribbon text-ribbon-success">
    <span>Aenean lacinia bibendum nulla sed consectetur. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Curabitur blandit tempus porttitor.</span>
  </span>
</p>

<h2 class="mt-5">
  <strong class="text-ribbon text-ribbon-info">
    <span>Gucci Flip flops</span>
  </strong>
</h2>
<p class="mt-4">
  <span class="text-ribbon text-ribbon-info">
    <span>Aenean lacinia bibendum nulla sed consectetur. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Curabitur blandit tempus porttitor.</span>
  </span>
</p>

<h2 class="mt-5">
  <strong class="text-ribbon text-ribbon-warning">
    <span>Gucci Flip flops</span>
  </strong>
</h2>
<p class="mt-4">
  <span class="text-ribbon text-ribbon-warning">
    <span>Aenean lacinia bibendum nulla sed consectetur. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Curabitur blandit tempus porttitor.</span>
  </span>
</p>

<h2 class="mt-5">
  <strong class="text-ribbon text-ribbon-danger">
    <span>Gucci Flip flops</span>
  </strong>
</h2>
<p class="mt-4">
  <span class="text-ribbon text-ribbon-danger">
    <span>Aenean lacinia bibendum nulla sed consectetur. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Curabitur blandit tempus porttitor.</span>
  </span>
</p>

{% endexample %}