Prompt pack · 25 prompts
Build better login flows, signup pages, onboarding UI, and account-related website components faster with AI.
Instant download after checkout. All sales are final — every prompt is listed below.
What's inside
Every one of these is in the download as a full, copy-paste prompt.
A translucent login card floating over a rich background with backdrop-blur glassmorphism, rounded edges, and social auth buttons that dynamically load OAuth SDKs on click — no full page reloads required.
Best forModern SaaS launches, premium apps, design-forward brands
A multi-step wizard form with an animated horizontal progress indicator, step-by-step field validation, and a Next button that only unlocks when all required fields in the current step pass validation.
Best forOnboarding flows, long signups, complex applications
A split-screen signup layout pairing a conversion form with a scroll-animated feature highlights panel, separated by a soft gradient fade that keeps both sides visually distinct yet harmonious.
Best forProduct-led signups, feature-rich SaaS, conversion pages
A clean password reset form with a dynamic strength meter that updates in real time as the user types, plus an accessible aria-live region that speaks strength changes to assistive tech.
Best forSecurity flows, account recovery, accessible auth UX
A refined contact form where labels animate upward and shrink on focus, with inline red and green validation messages appearing beneath each field on blur for instant, user-friendly feedback.
Best forContact pages, lead capture, modern product sites
An elegant authentication modal that layers over page content with a crisp backdrop blur, animating in and out via smooth scale and opacity transitions controlled entirely in vanilla JavaScript.
Best forGated content, paywalls, in-page login prompts
A polished 2FA code entry UI with single-digit boxes that auto-advance on input and reverse on backspace, complete with ARIA roles and a visible focus ring for fully accessible navigation.
Best for2FA flows, OTP verification, secure login steps
An adaptive survey form that reveals or hides subsequent sections based on prior answers, with fields fading in and out smoothly so respondents always see only what's relevant to them.
Best forUser research, onboarding quizzes, lead qualification
A soft neumorphic login interface with inset shadow inputs and smoothly animated toggle switches, blending Tailwind utilities with custom CSS variables for that unmistakable soft-UI feel.
Best forDesign-heavy apps, soft-UI experiments, settings panels
A signup form that folds pricing tier selection directly into the flow, with live price updates via peer/sibling selectors and a glowing ring highlighting the user's chosen plan.
Best forSaaS signups, subscription funnels, freemium upgrades
A contact form fused with an interactive Mapbox GL map where inputs float above the canvas and live map center and zoom update as the user types, perfect for location-aware inquiries.
Best forLocal businesses, storefronts, multi-location brands
A three-column registration form with a dashed drag-and-drop file upload zone and a responsive thumbnail grid that previews uploaded files instantly beneath the dropzone.
Best forDetailed registrations, portfolios, document-heavy signups
An authentication form that leads with a biometric WebAuthn login button for fingerprint or face recognition, gracefully falling back to username and password fields when biometrics aren't supported.
Best forModern mobile apps, secure dashboards, passwordless flows
A delightful feedback form built around clickable emoji rating icons that scale on select, complete with full keyboard navigation and aria-checked states for an accessible sentiment capture.
Best forPost-interaction feedback, NPS alternatives, delight surveys
A newsletter signup that celebrates successful submissions with a confetti burst and replaces the submit button with an animated green checkmark, turning conversion into a moment of joy.
Best forNewsletters, waitlists, content creator signups
A login form backed by a rotating gallery of full-bleed images that crossfade smoothly, with a top-to-transparent gradient overlay ensuring form text stays perfectly legible throughout the cycle.
Best forLifestyle brands, travel apps, premium product logins
A signup form with an embedded terms of service scroll box and a submit button that stays disabled until the user has scrolled all the way to the bottom — compliance meets clean UX.
Best forLegal-sensitive signups, fintech, compliance-heavy flows
A contact form paired with a floating live chat window, complete with animated typing indicators synchronized via WebSocket events — giving visitors an instant fallback to async form submission.
Best forSupport pages, sales inquiries, high-touch SaaS
A multi-step checkout form paired with a sticky order summary that updates live as the user fills in details, with smooth horizontal step transitions that keep buyers oriented every step of the way.
Best forE-commerce checkout, subscription signups, paid funnels
A passwordless auth form that validates email syntax with a debounce function and exposes a countdown timer showing how long until the magic link expires or can be resent.
Best forPasswordless auth, quick logins, low-friction apps
A profile update form featuring an instant avatar preview powered by the FileReader API and an interactive canvas cropper with draggable, resizable handles for pixel-perfect portrait framing.
Best forUser profiles, account settings, social platforms
A job application form that spawns additional fields on demand via smooth slide-down animations, alongside a live summary panel that mirrors the applicant's current answers in real time.
Best forCareers pages, HR portals, recruiter intake forms
A login form with an embedded CAPTCHA iframe that gates the submit button until verification succeeds, plus a shake animation on failed attempts to provide accessible, unmistakable error feedback.
Best forBot-prone logins, public-facing auth, anti-abuse flows
A signup form that pulls profile data directly from social platforms via OAuth and displays imported information in clean grid-based cards, with pulse animations during fetch to signal loading state.
Best forSocial-first apps, creator platforms, fast onboarding
A contact form with a voice input toggle that captures speech via the Web Speech API and renders a live, italicized transcription below the field with smooth fade transitions as the user speaks.
Best forAccessibility-first products, mobile UX, hands-free flows
Preview
Glassmorphism Login Card with Social Auth Integration
Act as a Senior Frontend Architect and UI/UX Expert. The Task: Write the complete, production-ready code for a [Glassmorphism Login Card with Social Auth Integration]. Tech Stack & Environment: - Strictly a SINGLE HTML file containing everything. - Use plain HTML5. - Use the Tailwind CSS CDN (<script src="https://cdn.tailwindcss.com"></script>) in the head for all styling. - Use plain Vanilla JavaScript enclosed in <script> tags for any interactivity. - Use inline SVG paths for any icons (do not use external icon libraries). Strict Requirements: - Visual Excellence: It must look like a premium, modern SaaS product (subtle shadows, rounded corners, clean borders, smooth hover/focus effects). - Responsive: Must look perfect on mobile, tablet, and desktop using Tailwind utility classes.
The feature-by-feature build steps continue in the pack — along with the other 24 prompts.
How to use it
Four steps. Zero setup. Every prompt in this pack is engineered to output a complete, single HTML file you can open directly in any browser.
Open any prompt page in this pack and copy the full prompt block to your clipboard.
Paste into Claude, ChatGPT, Gemini, Cursor, or any AI coding tool. No modifications required.
The AI returns a single complete HTML file. Copy the entire code block it produces.
Save it as index.html and double-click to open in your browser. Done.
What you get
Digital download from Gumroad, available right after checkout. Nothing ships.
Best for
SaaS builders, creators, freelancers, affiliate marketers, startup founders, and anyone who wants better auth and user-system website sections without starting from scratch every time.
All sales are final, per the Gumroad listing.
Questions
The pack’s own instructions name Claude, ChatGPT, Gemini, and Cursor. Paste a prompt into any of them, or a similar AI coding tool.
Each prompt asks the AI for one complete HTML file you can save and open in a browser. What comes back depends on the model you use — the pack recommends a strong one.
No build tools. Copy a prompt, paste it into your AI tool, save the HTML it returns, and open it in your browser.
The HTML version of the pack includes a customizer: enter your brand, colors, or feature goals and it generates a tailored version of any prompt.
No. All sales are final, as stated on the Gumroad listing. Every prompt in the pack is listed on this page so you can check it covers what you need first.
A prompt pack gives you single copy-paste prompts for individual UI features. The Mission Vault is a structured set of missions, safety rules, and build checklists for building complete dashboards with Claude Code.
More packs
Analytics dashboards, KPI grids, data tables, charts & kanban boards.
See the pack →Bold, high-converting hero sections that grab attention instantly.
See the pack →Navbars, mega-menus, sidebars & mobile navigation that just works.
See the pack →Product grids, carts, checkout flows & sales pages that convert.
See the pack →Landing pages, lead-gen funnels, popups & CTAs built to sell.
See the pack →Toasts, modals, slide-overs, loaders & animation that feels alive.
See the pack →Blog layouts, article pages, content blocks & editorial UI.
See the pack →Profiles, feeds, comments & community interface components.
See the pack →Footers, bottom bars, newsletter blocks & end-of-page sections.
See the pack →