simulator-styles

Style CDU Smart Forms with centralized design tokens and theme assets.

58|9|Updated May 5, 2026
One-click install
npx skills add https://github.com/corezoid/simulator-ai-plugin --skill simulator-styles
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: simulator-styles
Source: https://github.com/corezoid/simulator-ai-plugin/tree/main/plugins/simulator/skills/simulator-styles
Command: npx skills add https://github.com/corezoid/simulator-ai-plugin --skill simulator-styles

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Simulator styling enables consistent, scalable visual design for Smart Forms by centralizing tokens, resets, and layout patterns used across CDU apps.

Core Features & Use Cases

  • Owns the style layer (styles/ and pages/<id>/style) and reuses Smart Form tooling while focusing on visual design.
  • Defines tokens, resets, and layout conventions to rapidly theme forms, components, and pages.
  • Use cases include applying a new theme, restyling an existing CDU app, or building a formal design system for form-driven workflows.

Quick Start

Style a CDU form by editing pages/<id>/style to apply a new color theme and layout adjustments.

Frequently Asked Questions about simulator-styles

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

FAQPage Schema
How do I apply a centralized design system and theme tokens to CDU Smart Forms?

Apply centralized design system and theme tokens to CDU Smart Forms by editing the styles/ and pages/<id>/style layers. This centralizes visual conventions for tokens, resets, and layout configurations across Simulator.Company.

What is the best way to rapidly restyle an existing CDU app without editing individual components?

Rapidly restyle an existing CDU app by modifying centralized design tokens and layout conventions. This updates the visual design layer across all pages and components simultaneously without altering individual component logic.

Can I use CSS and LESS to build a formal design system for form-driven workflows?

Use CSS and LESS to build a formal design system for form-driven workflows. The styling layer defines modular styles, resets, and tokens that standardize visual output across the application.

Does the Smart Form styling workflow support live preview and deployment of design assets?

The Smart Form styling workflow supports live preview and deployment of design assets. It uses a pull, push, and deploy process to manage and apply styling updates directly to the CDU environment.

When do I need to define design tokens and resets for Simulator.Company pages?

Define design tokens and resets for Simulator.Company pages when you need to apply a new theme or build a formal design system. This ensures consistent, scalable visual design for form-driven workflows.