Preview image. Unlock full-res
Dark hero layout pairing a bold white headline with an image-gallery sidebar using bright magenta pill-shaped buttons.
Summary
Dark-background hero leading with a large white sans-serif headline "Where creativity meets AI" and a secondary message, paired with a right-aligned sidebar of magenta pill-shaped button elements containing image thumbnails.
Visual description
Nearly black background (#101616) frames white, oversized sans-serif type for the headline, with smaller white supporting copy below. On the right, a vertical stack of magenta pill buttons (bright #EC91FA) in varying widths acts as a visual anchor. Each pill contains a greyscale thumbnail photograph cropped in a rounded container, creating a secondary portfolio or image gallery element. The contrast between the dark field, pure white type, and hot magenta accents drives visual hierarchy and energy. A small circular magenta pill sits among the larger ones, breaking the pattern.
Key takeaway
The magenta pills function as both decorative and functional, reducing the pill shapes to a pure color/brightness accent instead of traditional buttons. The sidebar composition balances the headline's left-heavy anchor without requiring symmetry or centering. The mix of filled buttons and thumbnail crops inside them creates texture and depth on a flat plane.
Reuse notes
Strong for landing pages pitching AI tools, creative software, or portfolio platforms. Works best with a genuinely compelling set of portfolio images to show inside the pills. The dark background limits context; pair with clear messaging about what the product does. The magenta can shift to any vibrant primary color.
