Prompt & style library

Operational green + incident red + maintenance amber

UI/UX Pro Max

Act as a Frontend Developer. You are tasked with creating the front-end for Xiaomi's self-service management system. Your responsibilities include: - Designing a user-friendly interface using HTML5, CSS3, and JavaScript…

prompts.chat

Act as a Vibe Coding Expert. You are skilled in creating visually captivating and emotionally resonant landing pages. Your task is to design a landing page that embodies the unique vibe and identity of the brand. You wi…

prompts.chat

Act as a Web Developer specializing in task management applications. You are tasked with creating a web app that enables users to manage tasks through a weekly calendar and board view. Your task is to: - Design a user-f…

prompts.chat

Based on the approved concept, build the [Homepage/About/etc.] page. Constraints: - Single-file React component with Tailwind - Mobile-first, responsive - Performance budget: no library over 50kb unless justified - [Spe…

prompts.chat

Act as a web designer. You are tasked with creating an 'About Me' page that is visually appealing and functional. Your page should use Glassmorphism design principles with a light warm theme, resembling a pen and paper…

prompts.chat

Act as a Web Developer. You are tasked with creating a simple and visually appealing HTML page for a partner. Your task is to create an interactive page that displays a beautiful message when clicked. You will: - Use HT…

prompts.chat

Immersive scrolling experience where each screen fills the entire viewport, switching complete scenes on scroll. Ideal for brand stories, product introductions, and portfolio showcases.

StyleKit

Excitement purple + action orange [Accent adjusted from #F97316]

UI/UX Pro Max

Professional blue + deal green

UI/UX Pro Max

Industrial slate + stock green

UI/UX Pro Max

Brand blue + creator purple

UI/UX Pro Max

Academic navy + gold keynote + track chips

UI/UX Pro Max

Enabled green + disabled grey + experimental amber

UI/UX Pro Max

Education teal + course amber + grade green

UI/UX Pro Max

Status Audio's storefront CSS exposes a navy-and-neutral system anchored by the custom

Usual

Awesome DESIGN.md — e-commerce

Vivid gradient cards on dark backgrounds with thick colored borders and neon glow effects. Ideal for tech products, SaaS landing pages, and youth-oriented brands.

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 Z-pattern scanning layout based on eye-tracking, where the gaze moves from top-left to top-right, diagonally to bottom-left, then to bottom-right, forming a Z-path. Ideal for landing pages, marketing pages, and concis…

StyleKit

Animation-heavy, microinteractions, smooth transitions, scroll effects, parallax, entrance anim, page transitions. Best for Portfolio sites, storytelling platforms, interactive experiences, entertainment apps, creative,…

UI/UX Pro Max

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

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

An ultra-minimalist premium design style with generous whitespace, refined border radii, subtle shadows, and SF Pro-style typography, conveying the quality feel of high-end tech products.

StyleKit

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

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 clean, modern aesthetic built for independent storefronts. Product-first layouts with clear pricing hierarchy and smooth conversion paths.

StyleKit

A soft utility style for frequently used mobile tools, balancing efficiency and warmth with calm surfaces, clear state colors, and friendly hierarchy.

StyleKit

A refined and professional fintech style featuring Stripe purple as the primary color, complemented by gradient grid backgrounds, elegant card shadows, and smooth animations, ideal for payment products and developer too…

StyleKit

Vertical timeline layout connecting time nodes through a connecting line. Ideal for displaying historical progress, project milestones, work experience, and process steps.

StyleKit

Develop a comprehensive budget tracking application using HTML5, CSS3, and JavaScript. Create an intuitive dashboard showing income, expenses, savings, and budget status. Implement transaction management with categories…

prompts.chat

A developer-tools brand for AI-agent tool integration whose marketing surfaces lean into a dark, technical aesthetic with a single deep-electric-blue voltage (`#0007cd`). The page floor is near-black (`#0f0f0f`); cards…

abcDiatype

Awesome DESIGN.md

An inspired interpretation of Dell.com's 1996 design language — a catalog-era enterprise web design built around a literal black page frame, vivid flat color-block "ribbon cards" tinted in sage, salmon, periwinkle, sky,…

Arial Black

Awesome DESIGN.md

A confident dark-canvas builder marketing site that treats the page like a working artboard — pure black surfaces, white display type set in GT Walsheim Medium with aggressive negative tracking, and a single confident b…

GT Walsheim Framer Medium

Awesome DESIGN.md

Lamborghini's website is a cathedral of darkness — a digital stage where jet-black surfaces stretch infinitely and every element emerges from the void like a machine under a spotlight. The page is almost entirely black.…

Awesome DESIGN.md

Lovable's website radiates warmth through restraint. The entire page sits on a creamy, parchment-toned background (`#f7f4ed`) that immediately separates it from the cold-white conventions of most developer tool sites. T…

Awesome DESIGN.md

Mistral AI brands itself with a singular signature — atmospheric sunset gradients (mustard, orange, deep red) layered over photography of mountains, plus a horizontal "sunset stripe" bar that closes every page. The syst…

PP Editorial Old

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

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

Every product page at Blueland opens with a color-coded argument — lemon yellow (#fffcbb) for citrus, pale mint (#c8faa1) for eucalyptus, soft lavender (#fce5ff) for fresh linen — a candy-counter display that reframes c…

GT-Pressura

Awesome DESIGN.md — e-commerce

This interpretation is drawn from the Comotomo Shop All collection page, the

Noto Sans Display

Awesome DESIGN.md — e-commerce

A layout approach that breaks traditional symmetric grids, creating dynamic and engaging page structures through irregular column widths, overlapping elements, and visual tension. Ideal for creative portfolios, art exhi…

StyleKit

Turn a website into a terminal session: phosphor-green mono text, prompt prefixes, paired command-and-output blocks, and a tmux status bar. Tool authenticity as developer identity.

StyleKit

An F-pattern scanning layout based on eye-tracking research, where the user's gaze starts from the top-left, scans horizontally across the top, then moves downward, ideal for content-heavy pages, blog posts, and news li…

StyleKit

Classic Japanese RPG menu and dialogue box aesthetics with beveled borders, gradient backgrounds, status bars, and ornate frames. Ideal for game interfaces, interactive narratives, and fantasy-style products.

StyleKit

Vibrant modern gradient style with colorful gradient backgrounds, glass-textured cards, and dynamic lighting effects. Ideal for startups, digital products, and event pages.

StyleKit

Merging classic JRPG game UI with pixel anime aesthetics, featuring RPG dialogue boxes, status bars, pixel borders, and NES color palette for a nostalgic 8-bit game interface style.

StyleKit

Modular cards, asymmetric grid, varied sizes, Apple-style, dashboard tiles, negative space, clean hierarchy, cards. Best for Dashboards, product pages, portfolios, Apple-style marketing, feature showcases, SaaS.

UI/UX Pro Max

Bold minimalism, oversized typography, high contrast, negative space, loud minimal, statement design. Best for Fashion, architecture, portfolios, agency landing pages, luxury brands, editorial.

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

Dark tech + status green

UI/UX Pro Max

Book brown + page amber

UI/UX Pro Max

Formal neutral + patent type chips + status badges

UI/UX Pro Max

Anti-slop frontend skill for landing pages, portfolios, and redesigns. The agent reads the brief, infers the right design direction, and ships interfaces that do not look templated. Real design systems when applicable,…

taste-skill

Anti-AI-slop design skill for greenfield pages, audits, redesigns, and design extraction from URLs or screenshots. Use when the user asks to build a new app or landing page, wants to redesign something, invokes Hallmark…

Hallmark

Develop a web-based music player using HTML5, CSS3, and JavaScript with the Web Audio API. Create a modern interface with album art display and visualizations. Implement playlist management with drag-and-drop reordering…

prompts.chat

Create a web-based PDF viewer using HTML5, CSS3, JavaScript and PDF.js. Build a clean interface with intuitive navigation controls. Implement page navigation with thumbnails and outline view. Add text search with result…

prompts.chat

Create a comprehensive pomodoro timer app using HTML5, CSS3 and JavaScript following the time management technique. Design an elegant interface with a large, animated circular progress indicator that visually represents…

prompts.chat

Act as a UI/UX Designer. You are tasked with helping a user design a portfolio that emulates a PS5 interface theme. Your task is to: 1. Create an interface where the landing page displays only one user: ${username:defau…

prompts.chat

Act as a Career Management Assistant. You are tasked with creating a Google Sheets template specifically for tracking job and internship applications. Your task is to: - Design a spreadsheet layout that includes columns…

prompts.chat