skills.rest
Aqsagull99
Aqsagull99COMMUNITY
Explore all skills by this author →
GitHub

todo-signup-ui

Generate a two-panel glassmorphism signup UI with pink accents for todo apps.

Updated Dec 31, 2025
Search Tags:#typography#branding#UI design#glassmorphism#ux#signup#dark UI
One-click install
npx skills add https://github.com/Aqsagull99/hackathon-2-todo-app --skill todo-signup-ui
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: todo-signup-ui
Source: https://github.com/Aqsagull99/hackathon-2-todo-app/tree/main/.claude/skills/signup-skill
Command: npx skills add https://github.com/Aqsagull99/hackathon-2-todo-app --skill todo-signup-ui

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill provides a production-ready, premium signup experience for todo apps, centered on a black glassmorphic aesthetic with pink accents to convey trust and exclusivity.

Core Features & Use Cases

  • Glassmorphic signup card: pink glass, high contrast typography, and a clear single call to action.
  • Responsive two-panel layout: desktop two-column, mobile stacked, preserving brand feel.
  • Use Case: design a signup flow that reduces friction and increases conversions for SaaS todo apps.

Quick Start

Outline or mock up a two-panel signup screen with a branding-focused left pane and a right glass card, ready for UI prototyping.

Frequently Asked Questions about todo-signup-ui

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I design a glassmorphism signup UI for a SaaS todo app?▼

Design a glassmorphism signup UI by structuring a two-panel layout with a branding-focused left pane and a right glass card. This delivers a dark aesthetic with pink accents, strong typography, and a clear call-to-action to increase conversions.

What is the best way to create a responsive two-panel signup screen for dark UI?▼

The best way to create a responsive two-panel signup screen is using a desktop two-column layout that stacks vertically on mobile. This preserves the brand feel while ensuring a distraction-free experience across devices.

Can I use this glassmorphism signup layout for desktop and mobile todo apps?▼

Yes, you can use this glassmorphism signup layout for both desktop and mobile todo apps. It provides a responsive two-column design for desktop and a stacked layout for mobile, maintaining the dark UI aesthetic across platforms.

Does this dark glass signup design include accessibility considerations?▼

Yes, this dark glass signup design includes accessibility considerations alongside its color system and typography. The production-ready UI layout ensures high contrast and a clear primary call-to-action for an inclusive user experience.

Why use a two-panel signup flow with pink accents for a todo app?▼

Use a two-panel signup flow with pink accents to convey trust and exclusivity for your todo app. This brand-driven emotion combines with high contrast typography to reduce friction and increase signups.

What do I need to prototype a production-ready dark glassmorphism signup card?▼

To prototype a production-ready dark glassmorphism signup card, you need to outline a two-panel screen with a left branding pane and a right glass card. This establishes the layout structure, color system, and typography for UI prototyping.

Related Skills

Explore More Design & Creative Skills→
pascallammerspascallammers
1

brand-guidelines

Create brand guidelines covering visual identity, tone of voice, and messaging.

Community
Basic
shalevaminshalevamin

fullstack-guardian

Implement secure full-stack web applications with layered authentication and input validation.

Community
Advanced
RepairYourTechRepairYourTech
6

authentication-ui-flows

Design authentication UI flows with React, Zod, and CSS.

Community
Advanced
TheCraigHewittTheCraigHewitt
7.3k

signup-flow-cro

Optimize signup and registration flows to reduce friction and increase completion rates.

Community
Basic