Agent skill

Jaspr CSS-in-Dart Styling

Guides styling of Jaspr web components with the type-safe Styles API in Dart, covering @css annotations, inline styles and global stylesheets.

Apache-2.0Auto-check passedFrontend & Design

Install Jaspr CSS-in-Dart Styling

skills CLI

$ npx skills add rodydavis/signals.dart --skill jaspr-styling -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI

$ gh skill install rodydavis/signals.dart jaspr-styling --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy

$ git clone --depth 1 https://github.com/rodydavis/signals.dart.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/jaspr-styling .claude/skills/jaspr-styling && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Paste into Claude Code

Install the "jaspr-styling" agent skill from https://github.com/rodydavis/signals.dart/tree/main/.agents/skills/jaspr-styling into .claude/skills/jaspr-styling/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "jaspr-styling", then confirm the skill loads.

Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

$skill-installer

$skill-installer install https://github.com/rodydavis/signals.dart/tree/main/.agents/skills/jaspr-styling

Type this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.

skills CLI

$ npx skills add rodydavis/signals.dart --skill jaspr-styling -a codex

Project install goes to .agents/skills/; add -g for ~/.codex/skills/.

GitHub CLI

$ gh skill install rodydavis/signals.dart jaspr-styling --agent codex

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/rodydavis/signals.dart.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.agents/skills/jaspr-styling .agents/skills/jaspr-styling && rm -rf skills-src

Use ~/.agents/skills/ instead of .agents/skills for a personal install.

Codex skills documentation · loads skills from .agents/skills/

Paste into Codex

Install the "jaspr-styling" agent skill from https://github.com/rodydavis/signals.dart/tree/main/.agents/skills/jaspr-styling into .agents/skills/jaspr-styling/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "jaspr-styling", then confirm the skill loads.

Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add rodydavis/signals.dart --skill jaspr-styling -a cursor

Project install goes to .agents/skills/; add -g for ~/.cursor/skills/.

GitHub CLI

$ gh skill install rodydavis/signals.dart jaspr-styling --agent cursor

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/rodydavis/signals.dart.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.agents/skills/jaspr-styling .cursor/skills/jaspr-styling && rm -rf skills-src

Use ~/.cursor/skills/ instead of .cursor/skills for a personal install.

Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/

Paste into Cursor

Install the "jaspr-styling" agent skill from https://github.com/rodydavis/signals.dart/tree/main/.agents/skills/jaspr-styling into .cursor/skills/jaspr-styling/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "jaspr-styling", then confirm the skill loads.

Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

gemini skills install

$ gemini skills install https://github.com/rodydavis/signals.dart.git --path .agents/skills/jaspr-styling

--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.

skills CLI

$ npx skills add rodydavis/signals.dart --skill jaspr-styling -a gemini-cli

Project install goes to .agents/skills/; add -g for ~/.gemini/skills/.

GitHub CLI

$ gh skill install rodydavis/signals.dart jaspr-styling --agent gemini-cli

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/rodydavis/signals.dart.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.agents/skills/jaspr-styling .gemini/skills/jaspr-styling && rm -rf skills-src

Use ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.

Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/

Paste into Gemini CLI

Install the "jaspr-styling" agent skill from https://github.com/rodydavis/signals.dart/tree/main/.agents/skills/jaspr-styling into .gemini/skills/jaspr-styling/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "jaspr-styling", then confirm the skill loads.

Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

GitHub CLI

$ gh skill install rodydavis/signals.dart jaspr-styling

Installs for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).

skills CLI

$ npx skills add rodydavis/signals.dart --skill jaspr-styling -a github-copilot

Project install goes to .agents/skills/; add -g for ~/.copilot/skills/.

Manual copy

$ git clone --depth 1 https://github.com/rodydavis/signals.dart.git skills-src && mkdir -p .github/skills && cp -r skills-src/.agents/skills/jaspr-styling .github/skills/jaspr-styling && rm -rf skills-src

Use ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.

GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/

Paste into GitHub Copilot

Install the "jaspr-styling" agent skill from https://github.com/rodydavis/signals.dart/tree/main/.agents/skills/jaspr-styling into .github/skills/jaspr-styling/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "jaspr-styling", then confirm the skill loads.

GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add rodydavis/signals.dart --skill jaspr-styling -a opencode

OpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.

GitHub CLI

$ gh skill install rodydavis/signals.dart jaspr-styling --agent opencode

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/rodydavis/signals.dart.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.agents/skills/jaspr-styling .opencode/skills/jaspr-styling && rm -rf skills-src

Use ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.

OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/

Paste into OpenCode

Install the "jaspr-styling" agent skill from https://github.com/rodydavis/signals.dart/tree/main/.agents/skills/jaspr-styling into .opencode/skills/jaspr-styling/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "jaspr-styling", then confirm the skill loads.

OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

Facts

Skill name: jaspr-styling
GitHub stars: 819
Token cost: ~1.7k tokens
SKILL.md length: 427 words
Files: 8 (incl. references)
Skills in repo: 15
Repo updated: Sep 14, 2026
First seen: Oct 7, 2026
Licence: Apache-2.0

At a glance

Guides styling of Jaspr web components with the type-safe Styles API in Dart, covering @css annotations, inline styles and global stylesheets.

Works in 4 steps: Component-Level Styles (@css annotation) → Inline Styles → Global @css Styles → …
Styling a Jaspr component with scoped CSS-in-Dart rules
SKILL.md covers Rules for Styling and Jaspr Styles Properties
Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Styling rules for Jaspr components written with the typed `Styles` class instead of hand-written CSS strings. Component styles go in a static getter annotated with `@css` that returns a list of style rules, using specific selectors such as class names or ids because `@css` styles become global when rendered. Inline `Styles` instances are limited to values that change with state or parameters, and are not used for media queries, hover states or animations.

The skill also covers global styles, defined with `@css` on top-level getters in server and static modes, and external stylesheets, which are linked from the document head in server or static mode or from `web/index.html` in client mode. It includes a list of every property the `Styles()` class supports, and reference files cover animation, box, color, flexbox, grid, sizing and typography.

When your agent uses it

Styling a Jaspr component with scoped CSS-in-Dart rules
Choosing between @css styles and inline styles for dynamic values
Adding global styles or linking an external stylesheet in a Jaspr app
Looking up the typed Dart property for a flexbox, grid or animation style

Example prompts

“Style the Navbar component in my Jaspr app with a flex row and a dark background.”
“Move the inline styles on this ColorBox into an @css block and keep only the color dynamic.”
“Add a global stylesheet for body fonts to my Jaspr site.”
“Write a hover rule for the primary button in my Jaspr component.”

Requirements

A Jaspr project written in Dart

Workflow steps

4 steps, taken from the step headings in SKILL.md.

Component-Level Styles (@css annotation)
Inline Styles
Global @css Styles
Global External Stylesheets

What it can do on your machine

Read from SKILL.md and the folder at commit 81d64e8. It shows what the files ask for, not the result of running them.

Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md (its code samples are dart).
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Jaspr CSS-in-Dart Styling loads about 1.7k tokens when it runs, and up to ~4.9k if it reads all its reference files. Until then it costs about 39 tokens; SKILL.md has 427 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it: ~39
When it runs · the whole SKILL.md, loaded when a task matches: ~1.7k
With references · SKILL.md plus every file in references/, read only if the agent opens them: ~4.9k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from rodydavis/signals.dart at commit 81d64e8, republished under its Apache-2.0 licence (© rodydavis). 427 words, ~1,717 tokens.

Download SKILL.mdSave it as .claude/skills/jaspr-styling/SKILL.md (or your agent's skills folder). This skill also uses 7 other files; get the full folder from GitHub.

name: jaspr-styling
description: Write type-safe CSS-in-Dart to style Jaspr components. Use this skill when styling components, implementing themes, or using CSS properties.
metadata.jaspr_version: 0.23.1

Rules for Styling

Jaspr provides a native, type-safe CSS-in-Dart styling API via the Styles class.

1. Component-Level Styles (`@css` annotation)

The recommended approach for defining styles in Jaspr is inside your components to ensure better code locality.

Rule 1: You MUST use the @css annotation on a static getter returning List<StyleRule> to scope styles to a component.
Rule 2: You MUST use specific CSS selectors (like .main classes or #id ids) within css() to prevent your styles from bleeding into other components, as @css styles are globalized during rendering.

dart

class App extends StatelessComponent {
  const App({super.key});

  @override
  Component build(BuildContext context) {
    return div(classes: 'main', [
      p([.text('Hello World')]),
    ]);
  }

  @css
  static List<StyleRule> get styles => [
    css('.main', [
      // Use css('&') to refer to the parent selector (.main)
      css('&').styles(
        width: 100.px, // Note: Use `.px`, `.rem`, `.percent` extensions on numbers.
        padding: .all(10.rem),
        display: .flex,
      ),
      css('&:hover').styles(
        backgroundColor: Colors.blue,
      ),
      css('p').styles(
        color: Colors.blue,
      ),
    ]),
    // Responsive queries
    css.media(MediaQuery.screen(maxWidth: 600.px), [
      css('.main').styles(flexDirection: .column),
    ])
  ];
}

2. Inline Styles

You can pass Styles instances directly to native HTML components. This renders as the style="..." HTML attribute.

Rule 1: You MUST ONLY use inline styles for dynamic styles (e.g., styles that change based on state or parameters).
Rule 2: For static styles, you MUST use the component-level @css annotation.
Rule 3: You MUST NOT use inline styles for complex rules like media queries, hover states, or animations.

dart

// Example of dynamic inline styling driven by state
class ColorBox extends StatelessComponent {
  final Color boxColor;

  const ColorBox({required this.boxColor, super.key});

  @override
  Component build(BuildContext context) {
    return div(styles: Styles(backgroundColor: boxColor), []);
  }
}

3. Global `@css` Styles

You can define a global set of styles directly from Dart using the @css annotation on a global variable or getter.

Rule 1: Just like component-level @css, global @css is ONLY supported in server and static modes.
Rule 2: You MUST place global @css annotations on top-level getters or static getters returning List<StyleRule>.

dart

@css
List<StyleRule> get globalStyles => [
  css('body').styles(
    margin: .zero,
    fontFamily: .list([FontFamily('Roboto'), FontFamilies.sansSerif]),
    backgroundColor: Colors.white,
  ),
  css('a').styles(
    textDecoration: TextDecoration(line: .none),
    color: Colors.blue,
  ),
];

4. Global External Stylesheets

Rule: If you are using raw .css files (or other css frameworks like sass/scss, tailwind, etc.), you MUST include them using a <link rel="stylesheet"> element inside the Document(head: [...]) component (for server/static mode) or in web/index.html (for client mode).

Show full SKILL.md (169 more words)Show less

Jaspr Styles Properties

To avoid guessing CSS properties and overwhelming context, Jaspr maps CSS properties to strongly-typed Dart classes.

Here is the full list of properties both the Styles() class and .styles() method support:

dart

Styles({ // or .styles({
  All? all,
  // Box Styles
  String? content,
  Display? display,
  Position? position,
  ZIndex? zIndex,
  Unit? width,
  Unit? height,
  Unit? minWidth,
  Unit? minHeight,
  Unit? maxWidth,
  Unit? maxHeight,
  AspectRatio? aspectRatio,
  Padding? padding,
  Margin? margin,
  BoxSizing? boxSizing,
  Border? border,
  BorderRadius? radius,
  Outline? outline,
  double? opacity,
  Visibility? visibility,
  Overflow? overflow,
  Appearance? appearance,
  BoxShadow? shadow,
  Filter? filter,
  Filter? backdropFilter,
  Cursor? cursor,
  UserSelect? userSelect,
  PointerEvents? pointerEvents,
  Animation? animation,
  Transition? transition,
  Transform? transform,
  // Flexbox Styles
  FlexDirection? flexDirection,
  FlexWrap? flexWrap,
  JustifyContent? justifyContent,
  AlignItems? alignItems,
  AlignContent? alignContent,
  // Grid Styles
  GridTemplate? gridTemplate,
  List<TrackSize>? autoRows,
  List<TrackSize>? autoColumns,
  JustifyItems? justifyItems,
  Gap? gap,
  // Item Styles
  Flex? flex,
  int? order,
  AlignSelf? alignSelf,
  JustifySelf? justifySelf,
  GridPlacement? gridPlacement,
  // List Styles
  ListStyle? listStyle,
  ImageStyle? listImage,
  ListStylePosition? listPosition,
  // Text Styles
  Color? color,
  TextAlign? textAlign,
  FontFamily? fontFamily,
  Unit? fontSize,
  FontWeight? fontWeight,
  FontStyle? fontStyle,
  TextDecoration? textDecoration,
  TextTransform? textTransform,
  Unit? textIndent,
  Unit? letterSpacing,
  Unit? wordSpacing,
  Unit? lineHeight,
  TextShadow? textShadow,
  TextOverflow? textOverflow,
  WhiteSpace? whiteSpace,
  Quotes? quotes,
  // Background Styles
  Color? backgroundColor,
  ImageStyle? backgroundImage,
  BackgroundOrigin? backgroundOrigin,
  BackgroundPosition? backgroundPosition,
  BackgroundAttachment? backgroundAttachment,
  BackgroundRepeat? backgroundRepeat,
  BackgroundSize? backgroundSize,
  BackgroundClip? backgroundClip,
  // Raw Styles
  Map<String, String>? raw,
})

Rule 1: You MUST define all properties in the order they are defined in the Styles class.
Rule 2: You MUST use dot-shorthands for all style properties and values where applicable (e.g., padding: .all(10.px) instead of padding: Padding.all(Unit.pixels(10)), or justifyContent: .center instead of justifyContent: JustifyContent.center).
Rule 3: You MUST use raw for any properties that are not supported by the Styles class.

IMPORTANT: Before writing styles in one of the below areas, you MUST read the respective reference file provided alongside this skill:

references/sizing.md (Units like .px, .percent, dimensions, margin, padding, borders, border-radius)
references/color.md (Colors, HEX, RGB, HSL values)
references/box.md (Position, overflow, transform, background, cursor, filters, z-index, visibility)
references/typography.md (Text alignment, fonts, text decoration, letter spacing)
references/flexbox.md (Flexbox container/item, flex layout, alignments)
references/grid.md (Grid layout, track sizes, gaps, templates)
references/animation.md (Transitions, Animations, keyframes, curves, durations)

Files

SKILL.md and 7 other files (references) in .agents/skills/jaspr-styling of rodydavis/signals.dart.

SKILL.md
references/animation.md
references/box.md
references/color.md
references/flexbox.md
references/grid.md
references/sizing.md
references/typography.md

Open the folder on GitHubat commit 81d64e8

Compare with similar skills

Jaspr CSS-in-Dart Styling next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Jaspr CSS-in-Dart Styling compared with similar skills
Skill	Stars	Used in	Tokens	Auto-check	Licence	Repo updated
Jaspr CSS-in-Dart Styling this skillrodydavis/signals.dart	819	—	~1.7k	Automated safety check: Pass	Apache-2.0	25 days ago
Tailwindcss Developmentanonaddy/anonaddy	4.9k	10 repos	~865	Automated safety check: Pass	MIT	3 days ago
UI StylingOhh-889/skyroc	795	13 repos	~2.5k	Automated safety check: Pass	MIT	1 mo ago
MCP Developmentcoollabsio/coolify	63k	1 repos	~949	Automated safety check: Pass	MIT	today
Fixing Motion Performanceibelick/ui-skills	9.5k	5 repos	~1.4k	Automated safety check: Pass	MIT	2 days ago
Web Animation DesignbaptisteArno/typebot.io	11k	2 repos	~2.7k	Automated safety check: Pass	Custom licence	2 days ago

Similar skills

Tailwindcss Development
anonaddy/anonaddy
Always invoke when the user's message includes 'tailwind' in any form.
4.9k GitHub starsUsed in 10 repos~865 tokens
Frontend & DesignAuto-check passed
UI Styling
Ohh-889/skyroc
Create beautiful, accessible user interfaces with shadcn/ui components (built on Radix UI + Tailwind), Tailwind CSS utility-first styling, and canvas-based visual designs.
795 GitHub starsUsed in 13 repos~2.5k tokens
Frontend & DesignAuto-check passed
MCP Development
coollabsio/coolify
A skill your agent uses for Laravel MCP development. An agent skill from coollabsio/coolify.
63k GitHub starsUsed in 1 repo~949 tokens
Frontend & DesignAuto-check passed
Fixing Motion Performance
ibelick/ui-skills
Audits and fixes web animation performance: layout thrashing, work that belongs on the compositor, scroll-linked motion and costly blur effects.
9.5k GitHub starsUsed in 5 repos~1.4k tokens
Frontend & DesignAuto-check passed
Web Animation Design
baptisteArno/typebot.io
Guides easing, timing and animation choices for UI motion, based on a web animation course, and reviews existing animations in a before-and-after table.
11k GitHub starsUsed in 2 repos~2.7k tokens
Frontend & DesignAuto-check passed
UI UX Pro Max
saoudi-h/solar-icons
UI/UX design intelligence for web and mobile. An agent skill from saoudi-h/solar-icons.
186 GitHub starsUsed in 18 repos~11k tokens
Frontend & DesignAuto-check: notes

Questions about Jaspr CSS-in-Dart Styling

What does Jaspr CSS-in-Dart Styling do?

Guides styling of Jaspr web components with the type-safe Styles API in Dart, covering @css annotations, inline styles and global stylesheets. Styling rules for Jaspr components written with the typed `Styles` class instead of hand-written CSS strings. Component styles go in a static getter annotated with `@css` that returns a list of style rules, using specific selectors such as class names or ids because `@css` styles become global when rendered.

When should I use Jaspr CSS-in-Dart Styling?

Jaspr CSS-in-Dart Styling fits situations like: styling a Jaspr component with scoped CSS-in-Dart rules; choosing between @css styles and inline styles for dynamic values; adding global styles or linking an external stylesheet in a Jaspr app; looking up the typed Dart property for a flexbox, grid or animation style.

How do I install Jaspr CSS-in-Dart Styling in Claude Code?

Run `npx skills add rodydavis/signals.dart --skill jaspr-styling -a claude-code`. Or copy the skill folder (.agents/skills/jaspr-styling in rodydavis/signals.dart) into .claude/skills/jaspr-styling in your project. Claude Code loads it when a task matches its description.

How do I install Jaspr CSS-in-Dart Styling in Codex?

Run `npx skills add rodydavis/signals.dart --skill jaspr-styling -a codex`. Or copy the skill folder (.agents/skills/jaspr-styling in rodydavis/signals.dart) into .agents/skills/jaspr-styling in your project. Codex loads it when a task matches its description.

Can I use Jaspr CSS-in-Dart Styling in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add rodydavis/signals.dart --skill jaspr-styling -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/jaspr-styling, .gemini/skills/jaspr-styling, .github/skills/jaspr-styling and .opencode/skills/jaspr-styling in your project.

What does Jaspr CSS-in-Dart Styling need to run?

SKILL.md names no scripts, command-line tools or credentials: Jaspr CSS-in-Dart Styling is instructions for the agent only. Our summary lists: A Jaspr project written in Dart.

Does Jaspr CSS-in-Dart Styling access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Jaspr CSS-in-Dart Styling safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Jaspr CSS-in-Dart Styling use?

Jaspr CSS-in-Dart Styling is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Jaspr CSS-in-Dart Styling use?

About 1.7k tokens (SKILL.md is roughly 6.9k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 3.2k tokens, read only when the agent opens those files.

What are the alternatives to Jaspr CSS-in-Dart Styling?

Skills that share tags, products or a category with Jaspr CSS-in-Dart Styling: Tailwindcss Development (anonaddy/anonaddy, 4.9k stars), UI Styling (Ohh-889/skyroc, 795 stars), MCP Development (coollabsio/coolify, 63k stars) and Fixing Motion Performance (ibelick/ui-skills, 9.5k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Jaspr CSS-in-Dart Styling?

rodydavis (a GitHub user) maintains it in rodydavis/signals.dart, which has 819 GitHub stars. The repository holds 15 skills in this directory. The repository was last updated on September 14, 2026.

Source: rodydavis/signals.dart on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.

Jaspr CSS-in-Dart Styling

Install Jaspr CSS-in-Dart Styling

Facts

At a glance

What it does

When your agent uses it

Example prompts

Requirements

Workflow steps

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

Rules for Styling

1. Component-Level Styles (`@css` annotation)

2. Inline Styles

3. Global `@css` Styles

4. Global External Stylesheets

Jaspr Styles Properties

Files

Compare with similar skills

Similar skills

Tailwindcss Development

UI Styling

MCP Development

Fixing Motion Performance

Web Animation Design

UI UX Pro Max

More from rodydavis/signals.dart

Jaspr Component Fundamentals

Jaspr JS Interop

Jaspr Pre-Rendering and Hydration

Update Dart Examples Dependencies

Jaspr HTML Converter

Dart Monorepo Coverage Booster

Questions about Jaspr CSS-in-Dart Styling

Install Jaspr CSS-in-Dart Styling

Facts

At a glance

What it does

When your agent uses it

Example prompts

Requirements

Workflow steps

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

Rules for Styling

1. Component-Level Styles (@css annotation)

2. Inline Styles

3. Global @css Styles

4. Global External Stylesheets

Jaspr Styles Properties

Files

Compare with similar skills

Similar skills

More from rodydavis/signals.dart

Related

Questions about Jaspr CSS-in-Dart Styling

1. Component-Level Styles (`@css` annotation)

3. Global `@css` Styles