Prompt & style library

A hero section layout with fullscreen images or video backgrounds that captures attention through stunning visuals, ideal for brand showcases, product launches, and event promotions.

StyleKit

Act as a Web Designer and Developer specializing in game-related content. Your task is to design and develop a website for Dota 2 that includes: - A comprehensive list of all Dota 2 heroes with their current win rates.…

prompts.chat

A hero video dialog component.

Magic UI

A component that displays your image with a pixelated effect, enhancing the visual appeal of any image in your website.

Magic UI

Interactively compare two images with a draggable slider to reveal differences.

Motion-Primitives

A cinematic opener led by a short looping video. A poster frame paints first as the LCP; the muted video autoplays and loops only once in view; text sits on a readability scrim. Dark grading and slow motion build a trai…

StyleKit

Photography is the interface. Full-bleed images fill the viewport with text floating over readability scrims; a slow Ken Burns drift lets stills breathe, a blur-up placeholder loads first and the real frame fades in. Th…

StyleKit

Pinterest-style masonry layout with variable-height cards, achieved through CSS columns or masonry grid for a naturally flowing visual effect. Ideal for image galleries, portfolios, and social media.

StyleKit

A premium SaaS aesthetic built on a real-time WebGL fragment-shader mesh gradient. A slowly breathing iridescent field flows across a near-black canvas while frosted-glass panels float above it, paired with a clean mode…

StyleKit

A beauty brand that trusts the quiet authority of a single accent — #ff5742, a coral-red that appears only on the primary CTA and the occasional badge, never in the hero imagery or product photography. The rest of the p…

Articulat CF

Awesome DESIGN.md — e-commerce

The defining portfolio trend of 2026: type IS the layout. Names and headlines become viewport-scale heroes via fluid clamp() sizing, imagery recedes to accents, and a single international orange cuts through near-black…

StyleKit

An immersive layout creating depth parallax effects through fixed backgrounds and scrolling content, with each full-screen section having its own background layer. Ideal for brand stories, product showcases, and immersi…

StyleKit

A retro 8-bit pixel game style with no border radii, pixelated borders, hard-edge shadows, and vivid 8-bit color palettes, ideal for games, retro apps, and indie developer projects.

StyleKit

Symmetric or asymmetric split-screen layout creating visual tension through contrast and balance. Commonly used for product showcases, brand stories, and comparison pages.

StyleKit

A dark photography gallery portfolio: near-black canvases let full-bleed images command absolute attention; warm amber accents highlight metadata and captions while ultra-light typography retreats into the background. F…

StyleKit

An Apple-keynote product-reveal aesthetic: a pitch-black stage, luminous product imagery, huge tight-tracking headlines and one electric-blue accent. The signature is a scroll-scrubbed frame sequence - a sticky canvas p…

StyleKit

The couture aesthetic of a fashion maison's digital flagship: a porcelain ground, ink-noir type, one muted gold; oversized high-contrast Didone serif display, a full-bleed silk-motion film hero, and a lookbook grid with…

StyleKit

Editorial layout with physical depth. On warm paper, foreground text and background layers scroll at different rates to build real parallax; sticky image-text interlock, chapter numbers and drop caps turn long-form into…

StyleKit

A React Native developer-platform whose marketing site reads like a quietly-confident infrastructure brand. The base canvas is pure white with a soft sky-blue gradient atmospheric wash behind the hero; near-black ink (`…

Inter

Awesome DESIGN.md

Mintlify presents documentation infrastructure with a dual-mode aesthetic — atmospheric sky-gradient marketing heroes (cloud illustration backdrops, soft cream-to-blue washes) paired with dense developer-grade documenta…

Inter

Awesome DESIGN.md

MongoDB carries a strong dual-mode visual identity — dark deep-teal hero bands with bright MongoDB green ({colors.brand-green}) CTAs paired with stark white documentation surfaces. The signature green pill button is unm…

Euclid Circular A

Awesome DESIGN.md

Notion presents itself as the all-in-one workspace through a confident, illustration-rich brand voice — anchored by a deep navy hero band ({colors.brand-navy}) decorated with brand-colored sticky-note dots and mesh wire…

Notion Sans

Awesome DESIGN.md

An inspired interpretation of Shopifi's design language — a cinematic commerce platform that runs two parallel design tracks. The marketing-hero and product-narrative pages live on near-black canvases with full-bleed ph…

NeueHaasGrotesk Display

Awesome DESIGN.md

An inspired interpretation of Slacc's design language — a workplace messaging brand built on a deep aubergine primary, with cream-lavender hero gradients, blue inline links, and pill CTAs. The system pairs a proprietary…

Salesforce-Avant-Garde

Awesome DESIGN.md

An inspired interpretation of Spasex's design language — a mission-oriented aerospace brand built on pure black canvas, full-bleed photographic and video heroes of rockets and Mars landscapes, and uppercase D-DIN displa…

D-DIN-Bold

Awesome DESIGN.md

An inspired interpretation of Superhumon's design language — a fast-email productivity brand split between an editorial dark hero (deep indigo navy with violet-sky atmospheric backdrop and a portrait subject) and a quie…

Super Sans VF

Awesome DESIGN.md

Tesla's website is an exercise in radical subtraction — a digital showroom where the product is everything and the interface is almost nothing. The page opens with a full-viewport hero that fills the entire screen with…

Awesome DESIGN.md

An inspired interpretation of Together AI's design language — an AI infrastructure platform whose surface alternates between near-black hero bands (with a three-color orange-magenta-periwinkle gradient as the single pie…

The Future

Awesome DESIGN.md

An inspired interpretation of Vercel's design language — a developer-platform brand whose surface is a stark black-and-ink duet on near-white canvas, broken at hero scale by a multi-color mesh gradient (cyan / blue / ma…

Geist

Awesome DESIGN.md

An inspired interpretation of Vodafone's design language — a telecom super-brand whose web surface alternates between editorial photography hero bands with massive uppercase display headlines and clean white content ban…

Vodafone

Awesome DESIGN.md

Robot vacuum silhouettes float in LiDAR-cold studio light above near-black fields (#161616, #313131) — the product is the hero, and Roborock's digital canvas is engineered to serve it. Primary interactive voltage runs t…

proxima-nova

Awesome DESIGN.md — e-commerce

Clean anthracite (#1d1d1f) and near-void black (#080a0f) frame every hero section, throwing product photography into high-contrast relief — a staging technique borrowed from consumer electronics that positions Eufy as a…

Mach Tera

Awesome DESIGN.md — e-commerce

A white-cube, curator-style portfolio layout. Borderless large images line up along a horizontal snap-scroll rail; whitespace acts as the gallery wall, numbered hairline captions echo museum labels, and viewing becomes…

StyleKit

Vibrant gradients, smooth blend, Northern Lights effect, mesh gradient, luminous, atmospheric, abstract. Best for Modern SaaS, creative agencies, branding, music platforms, lifestyle, premium products, hero sections.

UI/UX Pro Max

Motion text, animated type, moving letters, dynamic, typing effect, morphing, scroll-triggered text. Best for Hero sections, marketing sites, video platforms, storytelling, creative portfolios, landing pages.

UI/UX Pro Max

Inter + Playfair Display — bold typography, editorial, poster, near-black, vermillion, luxury, type-as-hero, manifesto, high-contrast

Inter / Playfair Display

UI/UX Pro Max

Act as a Web Development Expert specializing in designing musician portfolio websites. Your task is to create a beautifully designed website that includes: - Booking capabilities - Event calendar - Hero section with Web…

prompts.chat

A backlight glow effect for videos, images, and SVGs.

Magic UI

A interactive component that enables zooming into images, videos and other elements.

Magic UI

An infinite scrolling component that can be used to display text, images, or videos.

Magic UI