Skills
.Work. You
Rest

style-modus-components-with-tailwind

Community

Theme-aware styling for Modus components.

Design & Creative#theming#design-system#css-variables#modus#border-utilities#opacity-utilities
Authorjulianoczkowski
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Styling Modus components with borders and opacity using CSS variables at runtime, avoiding Tailwind patterns that break when themes change.

Core Features & Use Cases

  • Custom border utilities that work with CSS variables across all six Modus themes.
  • Custom opacity utilities for text, background, and borders that adapt to runtime theming.
  • Use Case: Build theme-aware UI cards and alerts without Tailwind color classes.

Quick Start

Apply the custom border and opacity utilities to a sample Modus component to ensure runtime CSS variable theming across all six themes.

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: style-modus-components-with-tailwind
Download link: https://github.com/julianoczkowski/create-trimble-app/archive/main.zip#style-modus-components-with-tailwind

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 223,000+ vetted skills library on demand.