Quotes & Blockquotes

The blockquote element represents a section that is quoted from another source.

For quoting blocks of content from another source within your document. Wrap <blockquote class="blockquote"> around any HTML as the quote.

Basic & Colors

Use .blockquote-1 and .border-[brand | primary | success | info | warning | danger | dark] to set left border color. You also set the background color for blockquote

Life is from the inside out. When you shift on the inside, life shifts on the outside

Kamal Ravikant

Life can only be understood backwards; but it must be lived forwards


Difficult and meaningful will always bring more satisfaction than easy and meaningless.

Maxime Lagac??

I have no special talent. I am only passionately curious.

Albert Einstein

The successful warrior is the average man, with laser-like focus.

Bruce Lee
<blockquote class="blockquote-1 border-brand bg-brand-muted mb-30">
    <footer class="blockquote-footer">........</footer>
With the Quote Icon

Use .blockquote-2 and .blockquote-[brand | primary | success | info | warning | danger | dark] to set the quote icon color.

If life were predictable it would cease to be life, and be without flavor.

Eleanor Roosevelt

The way to get started is to quit talking and begin doing.

Walt Disney

Your time is limited, so don't waste it living someone else's life. Don't be trapped by dogma ??? which is living with the results of other people's thinking.

Steve Jobs
<blockquote class="blockquote blockquote-2 blockquote-success">
    <footer class="blockquote-footer">.....</footer>
Quote Avatar

Spread love everywhere you go. Let no one ever come to you without leaving happier.

Mother Teresa
<blockquote class="blockquote blockquote-3 text-center mb-50">
    <img src="......" alt="avatar">
    <footer class="blockquote-footer">....</footer>
Box Shadow

In the end, it's not the years in your life that count. It's the life in your years.

Abraham Lincoln
<blockquote class="blockquote blockquote-4">
    <footer class="blockquote-footer">......</footer>