1. Components
  2. Blockquote

Components

Tailwind CSS Blockquote

Implement and style Tailwind CSS Blockquote component to emphasise quoted or cited content. Widely used in articles, blog posts and testimonials.

Example

A basic form of a blockquote.

I just wanted to say that I'm very happy with my purchase so far. The documentation is outstanding - clear and detailed.

Sizes

Small size.

I just wanted to say that I'm very happy with my purchase so far. The documentation is outstanding - clear and detailed.

Medium size.

I just wanted to say that I'm very happy with my purchase so far. The documentation is outstanding - clear and detailed.

Large size.

I just wanted to say that I'm very happy with my purchase so far. The documentation is outstanding - clear and detailed.

Alignment

Use text utilities as needed to change the alignment of your blockquote.

I just wanted to say that I'm very happy with my purchase so far. The documentation is outstanding - clear and detailed.

Right aligned.

I just wanted to say that I'm very happy with my purchase so far. The documentation is outstanding - clear and detailed.

Naming a source

Identify the work.

I just wanted to say that I'm very happy with my purchase so far. The documentation is outstanding - clear and detailed.

Josh Grazioso

With avatar

Naming a source with avatar.

I just wanted to say that I'm very happy with my purchase so far. The documentation is outstanding - clear and detailed.

Avatar
Josh Grazioso
Source title

Left bordered

A blockquote option with border on the left side.

I just wanted to say that I'm very happy with my purchase so far. The documentation is outstanding - clear and detailed.

Avatar
Josh Grazioso
Source title