Two-tier layout with centered content and background

This two-tier layout utilizes Tailwind CSS utilities to create a full-width dark background section with centered content in the second tier. The first tier applies a dark gray background color class (bg-gray-900) and padding top and bottom using the sm breakpoint (py-24 sm:py-32). The second tier contains a max-width container with centered content using mx-auto, including a heading and paragraph text. Tailwind typography and spacing utilities like text-4xl, font-bold, tracking-tight, text-white, sm:text-6xl, and mt-6 are used.

Similar Components

Other components related to tailwind, css, layout, background, typography, utilities, responsive tags