SaaS
SaaS — Login Signup Pages
Copy-paste layout brief covering Shared Layout, Login Page, Signup Page and Forgot Password Page — hand it to ChatGPT, Claude, or v0 as-is.
SaaS — Login Signup Pages is a copy-ready build prompt for saas pages. Paste it into ChatGPT, Claude, v0 and iterate from the first draft it returns.
Everything on this page — the summary, the category and the how-to — is written by HowToPrompts; the link below goes to the original project.
| Use case | SaaS |
|---|---|
| Works with | ChatGPT, Claude, v0, Cursor |
| Source | websiteprompts.com |
Create login and signup pages for a SaaS application:
1. SHARED LAYOUT
- Split screen: Left side branding, Right side form
- Left side: Gradient background with logo, tagline, and testimonial
- Right side: White background with centered form
- Mobile: Form only, branding as header
2. LOGIN PAGE
Form elements:
- "Welcome back" heading
- Email input with icon
- Password input with show/hide toggle
- "Remember me" checkbox
- "Forgot password?" link
- "Sign in" primary button
Social login section:
- "Or continue with" divider
- Google sign-in button
- GitHub sign-in button (if B2B)
- Microsoft sign-in button
Footer:
- "Don't have an account? Sign up"
3. SIGNUP PAGE
Form elements:
- "Create your account" heading
- Full name input
- Work email input
- Password input with strength indicator
- Confirm password input
- Terms checkbox: "I agree to the Terms of Service and Privacy Policy"
- "Create account" primary button
Social signup:
- Same as login page
Footer:
- "Already have an account? Sign in"
4. FORGOT PASSWORD PAGE
- "Reset your password"
- "Enter your email and we'll send you a reset link"
- Email input
- "Send reset link" button
- "Back to login" link
5. DESIGN DETAILS
- Input focus states with accent color border
- Error states with red border and message
- Loading state for buttons
- Success messages in green
- Password requirements tooltip
- Subtle animations on focus/error
Security features to mention:
- "Your data is encrypted"
- "We never share your information"
- Show security badges if applicableHow to use it
- Copy the full prompt with the button above.
- Paste it into your model and add your brand, copy and colours.
- Ask for one section at a time if the first pass is too broad.
Compiled and written by HowToPrompts from public sources. View original source ↗
← Back to Website Prompts