27 PROMPTS · BONUS

Bonus Prompts & Tailwind Code

The pieces that do not fit a marketing page: command palettes, cookie consent, skeleton loading states, one-time API key reveals, cron builders, contrast checkers and keyboard shortcut recorders. Several ship interactive JavaScript alongside the markup.

Bonus

27 prompts

Toast notification — Tailwind CSS Bonus layout preview

Toast notification

Floating success message

Empty state — Tailwind CSS Bonus layout preview

Empty state

Friendly no-data placeholder

Cookie consent — Tailwind CSS Bonus layout preview

Cookie consent

Bottom privacy banner

Pricing badge / callout — Tailwind CSS Bonus layout preview

Pricing badge / callout

Small promo strip

Command palette — Tailwind CSS Bonus layout preview

Command palette

Spotlight-style ⌘K search overlay

File upload dropzone — Tailwind CSS Bonus layout preview

File upload dropzone

Drag area with in-progress file rows

Type-to-confirm delete dialog — Tailwind CSS Bonus layout preview

Type-to-confirm delete dialog

Destructive action gated by an exact match

Skeleton loading state — Tailwind CSS Bonus layout preview

Skeleton loading state

Pulsing placeholders that swap for content

Inline workspace slug editor — Tailwind CSS Bonus layout preview

Inline workspace slug editor

Edit, validate, and save a URL without leaving the page

Keyboard shortcut recorder — Tailwind CSS Bonus layout preview

Keyboard shortcut recorder

Capture accessible key combinations and flag conflicts

Selective diff staging — Tailwind CSS Bonus layout preview

Selective diff staging

Review and stage individual code hunks

WCAG contrast checker — Tailwind CSS Bonus layout preview

WCAG contrast checker

Test color pairs with live accessibility results

Cron schedule builder — Tailwind CSS Bonus layout preview

Cron schedule builder

Plain-English controls that emit a cron expression

One-time API key reveal — Tailwind CSS Bonus layout preview

One-time API key reveal

Shown once, with a countdown and a copy gate

Markdown live preview — Tailwind CSS Bonus layout preview

Markdown live preview

Split editor rendering as you type

Timezone overlap planner — Tailwind CSS Bonus layout preview

Timezone overlap planner

Four cities lined up to find a workable hour

Passphrase generator — Tailwind CSS Bonus layout preview

Passphrase generator

Word-based secrets with a live strength readout

Regex tester — Tailwind CSS Bonus layout preview

Regex tester

Pattern, flags and highlighted matches

JSON tree viewer — Tailwind CSS Bonus layout preview

JSON tree viewer

Collapsible nodes with types and counts

Design token swatch sheet — Tailwind CSS Bonus layout preview

Design token swatch sheet

Palette, spacing and radii with copyable values

Keyboard shortcuts sheet — Tailwind CSS Bonus layout preview

Keyboard shortcuts sheet

A searchable cheat sheet in a dialog

Prompt token counter — Tailwind CSS Bonus layout preview

Prompt token counter

Live estimate against a model context window

Agent run trace — Tailwind CSS Bonus layout preview

Agent run trace

Expandable tool-call timeline for an AI run

Feature flag rollout dial — Tailwind CSS Bonus layout preview

Feature flag rollout dial

Percentage slider with a live bucket grid

Webhook delivery inspector — Tailwind CSS Bonus layout preview

Webhook delivery inspector

Delivery log with backoff-aware retries

Release notes composer — Tailwind CSS Bonus layout preview

Release notes composer

Conventional commits to a version bump

Drag-to-reorder priority stack — Tailwind CSS Bonus layout preview

Drag-to-reorder priority stack

Pointer and keyboard reordering with live ranks