πŸ“„ tailwindcss/plus/ui-blocks/application-ui/layout/media-objects

File: media-objects.md | Updated: 11/15/2025

Source: https://tailwindcss.com/plus/ui-blocks/application-ui/layout/media-objects

5-day Mini-Course

Build UIs that don’t suck.

Short, tactical video lessons from the creator of Tailwind CSS, delivered directly to your inbox every day for a week.

Get the free course

Media Objects

Use these Tailwind CSS media object components to align images or icons with text, for things like user comments, blog posts, and author bios. These components are designed and built by the Tailwind CSS team, and include a variety of different styles and layouts.

Basic


Preview

Get the code β†’

Basic


Preview

Get the code β†’

Aligned to center


Preview

Get the code β†’

Aligned to center


Preview

Get the code β†’

Aligned to bottom


Preview

Get the code β†’

Aligned to bottom


Preview

Get the code β†’

Stretched to fit


Preview

Get the code β†’

Stretched to fit


Preview

Get the code β†’

Media on right


Preview

Get the code β†’

Media on right


Preview

Get the code β†’

Basic responsive


Preview

Get the code β†’

Basic responsive


Preview

Get the code β†’

Wide responsive


Preview

Get the code β†’

Wide responsive


Preview

Get the code β†’

Nested


Preview

Get the code β†’

Nested


Preview

Get the code β†’