Skills
.Work. You
Rest

panel-frontend

Community

Dark-mode UI, modern frontend tooling.

Software Engineering#frontend#nextjs#playwright#tailwind#shadcn#dark-mode#ui-patterns
AuthorMord0reK
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This skill codifies a dark-mode-first Next.js UI stack with Tailwind 4 and Shadcn UI, enforcing standardized design rules and data normalization practices across the frontend.

Core Features & Use Cases

  • Dark Mode Always On: HTML root has dark mode enforced and styling tokens consistently applied across components.
  • Standard UI Stack: Next.js 16 App Router, TypeScript 5, Tailwind 4, Shadcn UI, Lucide icons, and ECharts for metrics visualization.
  • Data Normalization Rules: Clear guidance for PascalCase to camelCase normalization in data handling and test verification with Playwright.
  • Reusable Architecture: Structured folders for app, auth, api, components, hooks, and tests to support scalable frontends.

Quick Start

Start the frontend with the standardized UI workflow to explore the panel frontend module.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: panel-frontend
Download link: https://github.com/Mord0reK/panel/archive/main.zip#panel-frontend

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.