frontend-ui-dark-ts
Build dark-themed React applications using Tailwind CSS with custom theming, glassmorphism effects, and Framer Motion animations. Use when creating dashboards, admin panels, or data-rich interfaces with a refined dark aesthetic.
Target: Cloud, operations & security. Automatically collected · unverified.
Excerpt from the author’s documentation
Extracted from a fixed version of SKILL.md in its original language. This is the author’s documentation; installation, compatibility and runtime results have not been verified by this site.
Read the original English text
Topics in the source
- Frontend UI Dark Theme (TypeScript)
- Stack
- Quick Start
- Project Structure
- Configuration
- index.html
- public/site.webmanifest
- tailwind.config.js
A modern dark-themed React UI system using Tailwind CSS and Framer Motion. Designed for dashboards, admin panels, and data-rich applications with glassmorphism effects and tasteful animations. | Package | Version | Purpose | |---------|---------|---------| | react | ^18.x | UI framework | | react-dom | ^18.x | DOM rendering | | react-router-dom | ^6.x | Routing | | framer-motion | ^11.x | Animations | | clsx | ^2.x | Class merging | | tailwindcss | ^3.x | Styling | | vite | ^5.x | Build tool | | typescript | ^5.x | Type safety | The HTML entry point with mobile viewport, favicons, and social meta tags: PWA manifest for installable web apps: | Element | Classes | |---------|---------| | Page title | text-2xl font-semibold text-text-primary | | Section title | text-lg font-semibold text-text-primary | | Card title | text-base font-medium text-text-primary | | Body text | text-sm text-text-secondary | | Caption | text-xs text-text-muted | | Label | text-sm font-medium text-text-secondary | | Use Case | Color | Class | |----------|-------|-------| | Primary action | Brand purple | bg-brand text-white | | Primary hover | Brand hover | hover:bg-brand-hover | | Page background | Neutral b
This is an excerpt. Refer to the complete source and its current requirements.
- Source repository
- microsoft/skills
- Source file
- .github/plugins/azure-sdk-typescript/skills/frontend-ui-dark-ts/SKILL.md
- Fixed revision
- 9287b443662d2433c85621c7325ee72a0ce499b5
Requirements
- Only the author’s Skill metadata is included. Read the full instructions to check dependencies, licensing and conditions of use.
A small first task
先阅读原作者说明，再决定是否在自己的 AI 工具中使用。
Instructions for your AI tool
- Claude Desktop: resource-specific guide not available yet
- Claude Code: resource-specific guide not available yet
- Cursor: resource-specific guide not available yet
- Codex: resource-specific guide not available yet
Author documentation is not live verification by this site. Without evidence, we do not mark a resource as compatible, safe or free.
Sources and evidence
This record was collected automatically. Its documentation, suitability and runtime behavior have not been manually verified.
Author: Microsoft Skills · original repository metadata. Documentation review: Not reviewed. Last source check: 2026-11-10T19:02:06.622Z.
Categories are inferred from names, descriptions and paths. They do not establish compatibility.
License and attribution
MIT. Third-party content and copyright remain with their authors. Refer to the original license and terms.
Original license ↗Synchronization, copying and user-reported success do not mark a resource as runtime-tested.
Limitations and notes
- Collecting metadata does not mean this site has installed, adapted, runtime-tested or security-reviewed the resource.