Redirecting to PayPal

Tailwind CSS Components – Metis Library

Browse 114 ready-made Tailwind CSS components from the Metis UI library. Every variant is fully responsive – copy the code or customize it in the visual editor and export clean code.

Tailwind Component #41

Tailwind Component

Error 404 Page with Burning Car Illustration

A centered error page showing a blue illustration of a burning car, a blue 'Error 404' heading, a 'Something went wrong!' heading, a short apology line, and two buttons to return home or try again. Layout is a simple vertical stack on a white background with no navigation or footer visible.

Tailwind Component #42

Tailwind Component

Split-screen FAQ section with blue illustration and question list

A two-column FAQ section with a blue illustrated panel showing a man at a desk on the left and the heading "Frequently Asked Questions" with four expandable-style question rows and chevron indicators on the right. The layout pairs an illustration with a vertical list of questions.

Tailwind Component #43

Tailwind Component

Dark Cookie Policy Consent Banner with Accept and Refuse Buttons

A dark-background cookie consent notice with a bold heading, multi-line policy text, and two buttons for accepting or refusing cookies. Content is stacked left-aligned with a filled primary button and an outlined secondary button.

Tailwind Component #44

Tailwind Component

Three-Tier Pricing Plan Section with Highlighted Middle Plan

A pricing section with a centered heading and three side-by-side plan cards (Beginner, Intermediate, Professional) showing monthly price, feature checklists, and Start Free Trial and Purchase buttons. The middle Intermediate card is highlighted with a dark background to emphasize it.

Tailwind Component #45

Tailwind Component

Contact Us Form with Department Selection and Terms Checkbox

A centered contact form with an eyebrow label and large heading, department radio options (Support, Sales), fields for subject, name, email, and message, a captcha-style field, a terms agreement checkbox, and a blue Submit button. The layout is a single vertical stack on a light background.

Tailwind Component #46

Tailwind Component

Testimonials Section with Six Author Cards and Show More Button

A testimonials section with a centered quote icon and heading, followed by a 3-column grid of six cards each showing an avatar, name, role, and body text. A blue 'Show more Testimonials' button sits below the grid.

Tailwind Component #47

Tailwind Component

Tailwind Component #48

Tailwind Component

Tailwind Component #49

Tailwind Component

Tailwind Component #50

Tailwind Component

Tailwind Component #51

Tailwind Component

Tailwind Component #52

Tailwind Component

Tailwind Component #53

Tailwind Component

Tailwind Component #54

Tailwind Component

Tailwind Component #55

Tailwind Component

Tailwind Component #56

Tailwind Component

Tailwind Component #57

Tailwind Component

Tailwind Component #58

Tailwind Component

Tailwind Component #59

Tailwind Component

Tailwind Component #60

Tailwind Component

The easiest way to create beautiful websites

The selected plan includes lifetime access to Shuffle Editor.

Lifetime License

Create an account

OR USE EMAIL

VAT included where applicable. Invoices provided.

Why creators choose Shuffle

From idea to beautiful design in minutes.

Shuffle pairs an AI visual editor with 80+ UI libraries, so you can design, build and export production‑ready code without starting from scratch.

  • An AI Agent that builds with you Describe a page, watch it come to life, then fine-tune it visually or with a prompt.
  • Pick the best model for every task GPT-6 Astra, Claude Opus 5.5 and Gemini 4 Argon in one place.
  • 13,400+ professionally designed components Prefer building by hand? Drag in pixel-perfect sections crafted by professional designers.
  • Export to the stack you love Next.js, Astro, Laravel, WordPress, Shopify, static HTML and beyond.
“Its AI-powered features have transformed how I work! Designing and building websites has become faster, easier, and far more efficient.”
Est. 2019
Helping web builders ship since 2019 7 years of steady development.

Make it yours with AI

Start with this component. Tell AI what to change.

Original
Preview the original component.
Your Version
Available when your generation is complete.
Code
Available when your generation is complete.
Original component

Add images & videos

Upload an asset, then tell AI how to use it.

How it works

Your uploaded file will be added directly to the generated component. After uploading, you can guide the AI on where exactly to use it, e.g. as a logo or as a section image.

© 2026 Shuffle. All rights reserved.