todo-dashboard-ui

Create a responsive Todo dashboard UI with black glassmorphism and design tokens.

Updated Dec 31, 2025
One-click install
npx skills add https://github.com/Aqsagull99/hackathon-2-todo-app --skill todo-dashboard-ui
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: todo-dashboard-ui
Source: https://github.com/Aqsagull99/hackathon-2-todo-app/tree/main/.claude/skills/Dashbaord-skill
Command: npx skills add https://github.com/Aqsagull99/hackathon-2-todo-app --skill todo-dashboard-ui

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides a production-ready, brand-consistent Todo dashboard UI with black glassmorphism to align with the signup/signin experience, enabling a cohesive user interface for task management.

Core Features & Use Cases

  • Task-focused dashboard with consistent theming, typography, and motion principles.
  • Visual continuity with authentication screens to reduce cognitive load during workflow transitions.
  • Responsive layout supporting desktop, tablet, and mobile usage.

Quick Start

Install dependencies and run the UI server, then open the dashboard in your browser.

Frequently Asked Questions about todo-dashboard-ui

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

FAQPage Schema
How do I create a glassmorphism dashboard UI for task management?

A glassmorphism dashboard UI uses enforced design tokens to render a black-themed, task-focused layout. It ensures visual continuity with auth screens and applies consistent typography, icons, and animation rules across desktop, tablet, and mobile breakpoints.

What is auth continuity in dashboard UI design?

Auth continuity in dashboard UI design maintains visual consistency between signin and signup screens and the main task interface. It enforces shared theming, typography, and motion principles to reduce cognitive load during user workflow transitions.

Can I use react-icons in a dark-theme task management dashboard?

Yes, you can use react-icons in a dark-theme dashboard. The UI enforces auth-theme typography and icon rules using specified design tokens, ensuring react-icons integrate seamlessly within the black glassmorphism visual framework.

Does this dashboard UI support responsive layouts for mobile and tablet?

Yes, this dashboard UI supports responsive layouts across desktop, tablet, and mobile devices. It applies a task-focused layout structure that adapts seamlessly while maintaining the black glassmorphism aesthetic and auth-theme visual continuity.

What's the best way to align a Todo dashboard with existing authentication screens?

The best way to align a Todo dashboard with auth screens is to enforce shared design tokens for theming, typography, and motion. This creates brand-aligned visual continuity, reducing cognitive load when users transition between signin and task workflows.

Why does my task management dashboard layout break on different screen sizes?

Dashboard layouts break without enforced responsive design tokens. This UI prevents that by applying a task-focused layout with black glassmorphism that targets seamless continuity and adaptive rendering across desktop, tablet, and mobile viewports.