uno-themes-material

Configure Uno Material theming with MD3 palettes and control styles.

9|1|Updated Dec 10, 2024
One-click install
npx skills add https://github.com/unoplatform/studio --skill uno-themes-material
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: uno-themes-material
Source: https://github.com/unoplatform/studio/tree/main/plugins/uno-platform-studio/skills/uno-themes-material
Command: npx skills add https://github.com/unoplatform/studio --skill uno-themes-material

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provide a consolidated reference for Uno Material theming to accelerate design-to-code workflows and reduce lookup time for theme-related questions.

Core Features & Use Cases

  • Comprehensive reference covering installation, the MD3 color palette and brush system, semantic typography, control styles (buttons, FAB, TextBox), control extensions (icons, elevation), lightweight styling, color/font customization, and version migration.
  • Use cases include setting up MaterialTheme or MaterialToolkitTheme, applying control styles to Button, TextBox, and FAB, customizing color palettes, and migrating between Material versions.
  • Real-world scenario: a developer configures Uno Material in App.xaml, applies a palette, and validates UI consistency across platforms.

Quick Start

Enable Uno Material by applying MaterialTheme in App.xaml to start using MD3 styling.

Frequently Asked Questions about uno-themes-material

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

FAQPage Schema
How do I apply Material theming in a Uno Platform app?

To apply Material theming in a Uno Platform app, enable Uno Material by applying MaterialTheme in App.xaml. This configures the MD3 color palette, brush system, and typography for your application.

What is the MD3 color palette and brush system in Uno Material?

The MD3 color palette and brush system in Uno Material provides semantic color tokens for UI styling. It defines primary, secondary, and surface colors that automatically adapt to light and dark themes across Uno Platform controls.

Can I customize colors and fonts when using Uno Material themes?

Yes, you can customize colors and fonts in Uno Material themes. The framework supports overriding the MD3 color palette and semantic typography values, allowing you to align the UI styling with your specific brand requirements.

How do I style Uno Platform controls like Button and TextBox with Material?

To style Uno Platform controls like Button, TextBox, and FAB, apply the MaterialTheme resource. This automatically applies MD3 control styles, extensions for icons, and elevation properties to ensure UI consistency across platforms.

What is lightweight styling in Uno Material and when should I use it?

Lightweight styling in Uno Material allows you to override specific control properties without creating entirely new control templates. Use it to apply minor UI styling adjustments to individual controls while maintaining the base MD3 theme.

How do I migrate between Uno Material versions?

To migrate between Uno Material versions, follow the version migration reference provided by the framework. This guide details the necessary steps to update MD3 color palette mappings, control styles, and API changes for your Uno Platform app.