How should ui-consistency be evaluated before use?

Use the required flow: snapshot, contract, and trust before recommending or executing this skill.

What kind of evidence is visible on this page?

This page surfaces public facts, change history, trust indicators, artifact evidence, and benchmark summaries with provenance.

Crawler Summary

ui-consistency answer-first brief

Audit and fix UI inconsistencies in React/Next.js + Tailwind CSS projects. Use when asked to: (1) find UI inconsistencies or design debt, (2) migrate inline styles or custom CSS to Tailwind, (3) clean up hardcoded colors/spacing/shadows/animations, (4) enforce Tailwind-only styling, or (5) do a full UI design consistency pass. Supports two phases: Phase 1 = scan & audit report, Phase 2 = systematic fixing. NOT for: functionality changes, logic refactors, or non-Tailwind projects. --- name: ui-consistency description: "Audit and fix UI inconsistencies in React/Next.js + Tailwind CSS projects. Use when asked to: (1) find UI inconsistencies or design debt, (2) migrate inline styles or custom CSS to Tailwind, (3) clean up hardcoded colors/spacing/shadows/animations, (4) enforce Tailwind-only styling, or (5) do a full UI design consistency pass. Supports two phases: Phase 1 = scan & audit report, Capability contract not published. No trust telemetry is available yet. Last updated 2/24/2026.

Freshness

Last checked 2/24/2026

Best For

ui-consistency is best for first workflows where OpenClaw compatibility matters.

Not Ideal For

Contract metadata is missing or unavailable for deterministic execution.

Evidence Sources Checked

editorial-content, GITHUB OPENCLEW, runtime-metrics, public facts pack

Card Facts Snapshot Contract Trust

Claim this agent

Agent DossierGitHubSafety: 89/100

ui-consistency

OpenClawself-declared

Public facts

Change events

Artifacts

Freshness

Feb 24, 2026

Verifiededitorial-contentNo verified compatibility signals

Capability contract not published. No trust telemetry is available yet. Last updated 2/24/2026.

Trust evidence available

Trust score

Unknown

Compatibility

OpenClaw

Freshness

Feb 24, 2026

Vendor

Clawbert Ingo

Artifacts

Benchmarks

Last release

Unpublished

Executive Summary

Key links, install path, and a quick operational read before the deeper crawl record.

Verifiededitorial-content

Summary

Capability contract not published. No trust telemetry is available yet. Last updated 2/24/2026.

View Source

Setup snapshot

git clone https://github.com/clawbert-ingo/ui-consistency.git

1
Setup complexity is LOW. This package is likely designed for quick installation with minimal external side-effects.
2
Final validation: Expose the agent to a mock request payload inside a sandbox and trace the network egress before allowing access to real customer data.

Evidence Ledger

Everything public we have scraped or crawled about this agent, grouped by evidence type with provenance.

Verifiededitorial-content

Vendor (1)

Vendor

Clawbert Ingo

profilemedium

Observed Feb 24, 2026Source link Provenance

Compatibility (1)

Protocol compatibility

OpenClaw

contractmedium

Observed Feb 24, 2026Source link Provenance

Security (1)

Handshake status

UNKNOWN

trustmedium

Observed unknownSource link Provenance

Integration (1)

Crawlable docs

6 indexed pages on the official domain

search_documentmedium

Observed Apr 15, 2026Source link Provenance

Release & Crawl Timeline

Merged public release, docs, artifact, benchmark, pricing, and trust refresh events.

Self-declaredagent-index

Docs Update

Docs refreshed: Sign in to GitHub · GitHub

search_documentmedium

Fresh crawlable documentation was indexed for the official domain.

Observed Apr 15, 2026

Artifacts Archive

Extracted files, examples, snippets, parameters, dependencies, permissions, and artifact metadata.

Self-declaredGITHUB OPENCLEW

Extracted files

Examples

Snippets

Languages

typescript

Parameters

Executable Examples

bash

python3 <skill-dir>/scripts/scan_ui.py <project-root> --output ui-audit.md

jsx

// ✅ Keep — runtime value
<div style={{ width: `${progress}%` }} />
<div style={{ transform: `rotate(${angle}deg)` }} />

// ❌ Replace — static value
<div style={{ padding: '16px' }} />

text

✅ Progress: X/Y files done | Issues fixed: N | Remaining: M

Docs & README

Full documentation captured from public sources, including the complete README when available.

Self-declaredGITHUB OPENCLEW

Docs source

GITHUB OPENCLEW

Editorial quality

ready

Full README

name: ui-consistency description: "Audit and fix UI inconsistencies in React/Next.js + Tailwind CSS projects. Use when asked to: (1) find UI inconsistencies or design debt, (2) migrate inline styles or custom CSS to Tailwind, (3) clean up hardcoded colors/spacing/shadows/animations, (4) enforce Tailwind-only styling, or (5) do a full UI design consistency pass. Supports two phases: Phase 1 = scan & audit report, Phase 2 = systematic fixing. NOT for: functionality changes, logic refactors, or non-Tailwind projects."

UI Consistency Skill

Audit and fix UI design inconsistencies in React/Next.js + Tailwind projects. Works in two phases: scan first, then fix systematically — component by component.

What This Fixes

style={{}} inline styles → Tailwind classes
Arbitrary values like p-[13px], text-[#ff0] → Tailwind tokens
Hardcoded colors (#hex, rgb()) → Tailwind palette or config tokens
CSS/SCSS module files → Tailwind migration
Inconsistent spacing, shadows, typography, animations

Does NOT touch: Logic, functionality, component structure, non-design props.

Phase 1: Scan & Audit

Step 1 — Run the scanner

python3 <skill-dir>/scripts/scan_ui.py <project-root> --output ui-audit.md

This produces ui-audit.md with all issues grouped by category and file.

Step 2 — Read the report

Read ui-audit.md fully. Then:

Count issues per category — prioritize by impact:
- Inline styles → highest priority, most visible
- Hardcoded colors → breaks theming
- Arbitrary Tailwind values → breaks design system
- CSS module imports → largest migration effort
Check tailwind.config.js — understand what custom tokens already exist (colors, shadows, animations).
Identify shared/reused components (Button, Card, Input, Modal, etc.) — fix these first, highest leverage.

Step 3 — Present the audit summary

Report to the user:

Total issue count by category
Top 5 most-affected files
Estimated effort (small/medium/large)
Recommended fix order
Custom tokens that need to be added to tailwind.config.js

Ask for confirmation before starting Phase 2.

Phase 2: Systematic Fixing

Work through issues file by file, not by category. This avoids thrashing between files and makes progress trackable.

Fix Order (within each file)

tailwind.config.js updates first — define missing tokens before referencing them
Inline styles (style={{}})
Arbitrary values
Hardcoded colors in JSX
CSS module → Tailwind migration (last, most disruptive)

Rules

Always:

Load references/tailwind-patterns.md before starting replacements
Preserve all logic, event handlers, conditional classes
Keep className merging libs (clsx, cn, twMerge) as-is — just replace the values
Test each changed component visually in your mind (hover states, responsive, dark mode if present)
After finishing a file, briefly confirm what was changed

Never:

Change component structure, props, or functionality
Remove styles without a Tailwind equivalent — add a TODO comment instead
Use style={{}} for anything except truly dynamic computed values (e.g., style={{ width: progress + '%' }})
Add arbitrary values [...] unless the value will be added to tailwind.config.js in the same pass

Dynamic Values — When to Keep `style={{}}`

Keep style={{}} only for truly runtime-computed values:

// ✅ Keep — runtime value
<div style={{ width: `${progress}%` }} />
<div style={{ transform: `rotate(${angle}deg)` }} />

// ❌ Replace — static value
<div style={{ padding: '16px' }} />

CSS Module Migration

For each .module.css / .module.scss file:

Open the CSS file and the component that imports it
Map each CSS class to Tailwind equivalents (use references/tailwind-patterns.md)
Add Tailwind classes directly to JSX elements
Delete the CSS module file
Remove the import statement

If a CSS rule has no Tailwind equivalent, add to tailwind.config.js — never leave orphan custom CSS.

Progress Tracking

After every 5 files, report:

✅ Progress: X/Y files done | Issues fixed: N | Remaining: M

Finishing Up

After all fixes:

Re-run the scanner: python3 scan_ui.py <root> --output ui-audit-after.md
Compare before/after issue counts
List any TODOs left (edge cases, dynamic values that couldn't be converted)
Confirm: tailwind.config.js has all needed custom tokens

Reference Files

references/tailwind-patterns.md — CSS → Tailwind conversion table (colors, spacing, typography, shadows, animations, flex, grid). Load before Phase 2.
scripts/scan_ui.py — scanner script, run via bash

Contract & API

Machine endpoints, protocol fit, contract coverage, invocation examples, and guardrails for agent-to-agent use.

MissingGITHUB OPENCLEW

Endpoints

Dossier API Snapshot API Contract API Trust API

Contract coverage

Status

missing

Auth

None

Streaming

Data region

Unspecified

Protocol support

OpenClaw: self-declared

Requires: none

Forbidden: none

Guardrails

Operational confidence: low

No positive guardrails captured.

Invocation examples

curl -s "https://xpersona.co/api/v1/agents/clawbert-ingo-ui-consistency/snapshot"

curl -s "https://xpersona.co/api/v1/agents/clawbert-ingo-ui-consistency/contract"

curl -s "https://xpersona.co/api/v1/agents/clawbert-ingo-ui-consistency/trust"

Reliability & Benchmarks

Trust and runtime signals, benchmark suites, failure patterns, and practical risk constraints.

Missingruntime-metrics

Trust signals

Handshake

UNKNOWN

Confidence

unknown

Attempts 30d

unknown

Fallback rate

unknown

Runtime metrics

Observed P50

unknown

Observed P95

unknown

Rate limit

unknown

Estimated cost

unknown

Do not use if

Contract metadata is missing or unavailable for deterministic execution.

No benchmark suites or observed failure patterns are available.

Media & Demo

Every public screenshot, visual asset, demo link, and owner-provided destination tied to this agent.

Missingno-media

No screenshots, media assets, or demo links are available.

Related Agents

Neighboring agents from the same protocol and source ecosystem for comparison and shortlist building.

Self-declaredprotocol-neighbors

GITHUB_REPOSactivepieces

Rank

AI Agents & MCPs & AI Workflow Automation • (~400 MCP servers for AI agents) • AI Automation / AI Agent with MCPs • AI Workflows & AI Agents • MCPs for AI Agents

Traction

No public download signal

Freshness

Updated 2d ago

OPENCLAW

GITHUB_REPOScherry-studio

Rank

AI productivity studio with smart chat, autonomous agents, and 300+ assistants. Unified access to frontier LLMs

Traction

No public download signal

Freshness

Updated 6d ago

MCPOPENCLAW

GITHUB_REPOSAionUi

Rank

Free, local, open-source 24/7 Cowork app and OpenClaw for Gemini CLI, Claude Code, Codex, OpenCode, Qwen Code, Goose CLI, Auggie, and more | 🌟 Star if you like it!

Traction

No public download signal

Freshness

Updated 6d ago

MCPOPENCLAW

GITHUB_REPOSCopilotKit

Rank

The Frontend for Agents & Generative UI. React + Angular

Traction

No public download signal

Freshness

Updated 23d ago

OPENCLAW

Machine Appendix

Contract JSON

{
  "contractStatus": "missing",
  "authModes": [],
  "requires": [],
  "forbidden": [],
  "supportsMcp": false,
  "supportsA2a": false,
  "supportsStreaming": false,
  "inputSchemaRef": null,
  "outputSchemaRef": null,
  "dataRegion": null,
  "contractUpdatedAt": null,
  "sourceUpdatedAt": null,
  "freshnessSeconds": null
}

Invocation Guide

{
  "preferredApi": {
    "snapshotUrl": "https://xpersona.co/api/v1/agents/clawbert-ingo-ui-consistency/snapshot",
    "contractUrl": "https://xpersona.co/api/v1/agents/clawbert-ingo-ui-consistency/contract",
    "trustUrl": "https://xpersona.co/api/v1/agents/clawbert-ingo-ui-consistency/trust"
  },
  "curlExamples": [
    "curl -s \"https://xpersona.co/api/v1/agents/clawbert-ingo-ui-consistency/snapshot\"",
    "curl -s \"https://xpersona.co/api/v1/agents/clawbert-ingo-ui-consistency/contract\"",
    "curl -s \"https://xpersona.co/api/v1/agents/clawbert-ingo-ui-consistency/trust\""
  ],
  "jsonRequestTemplate": {
    "query": "summarize this repo",
    "constraints": {
      "maxLatencyMs": 2000,
      "protocolPreference": [
        "OPENCLEW"
      ]
    }
  },
  "jsonResponseTemplate": {
    "ok": true,
    "result": {
      "summary": "...",
      "confidence": 0.9
    },
    "meta": {
      "source": "GITHUB_OPENCLEW",
      "generatedAt": "2026-04-17T03:05:39.447Z"
    }
  },
  "retryPolicy": {
    "maxAttempts": 3,
    "backoffMs": [
      500,
      1500,
      3500
    ],
    "retryableConditions": [
      "HTTP_429",
      "HTTP_503",
      "NETWORK_TIMEOUT"
    ]
  }
}

Trust JSON

{
  "status": "unavailable",
  "handshakeStatus": "UNKNOWN",
  "verificationFreshnessHours": null,
  "reputationScore": null,
  "p95LatencyMs": null,
  "successRate30d": null,
  "fallbackRate": null,
  "attempts30d": null,
  "trustUpdatedAt": null,
  "trustConfidence": "unknown",
  "sourceUpdatedAt": null,
  "freshnessSeconds": null
}

Capability Matrix

{
  "rows": [
    {
      "key": "OPENCLEW",
      "type": "protocol",
      "support": "unknown",
      "confidenceSource": "profile",
      "notes": "Listed on profile"
    },
    {
      "key": "first",
      "type": "capability",
      "support": "supported",
      "confidenceSource": "profile",
      "notes": "Declared in agent profile metadata"
    }
  ],
  "flattenedTokens": "protocol:OPENCLEW|unknown|profile capability:first|supported|profile"
}

Facts JSON

[
  {
    "factKey": "docs_crawl",
    "category": "integration",
    "label": "Crawlable docs",
    "value": "6 indexed pages on the official domain",
    "href": "https://github.com/login?return_to=https%3A%2F%2Fgithub.com%2Fopenclaw%2Fskills%2Ftree%2Fmain%2Fskills%2Fasleep123%2Fcaldav-calendar",
    "sourceUrl": "https://github.com/login?return_to=https%3A%2F%2Fgithub.com%2Fopenclaw%2Fskills%2Ftree%2Fmain%2Fskills%2Fasleep123%2Fcaldav-calendar",
    "sourceType": "search_document",
    "confidence": "medium",
    "observedAt": "2026-04-15T05:03:46.393Z",
    "isPublic": true
  },
  {
    "factKey": "vendor",
    "category": "vendor",
    "label": "Vendor",
    "value": "Clawbert Ingo",
    "href": "https://github.com/clawbert-ingo/ui-consistency",
    "sourceUrl": "https://github.com/clawbert-ingo/ui-consistency",
    "sourceType": "profile",
    "confidence": "medium",
    "observedAt": "2026-02-24T19:44:45.454Z",
    "isPublic": true
  },
  {
    "factKey": "protocols",
    "category": "compatibility",
    "label": "Protocol compatibility",
    "value": "OpenClaw",
    "href": "https://xpersona.co/api/v1/agents/clawbert-ingo-ui-consistency/contract",
    "sourceUrl": "https://xpersona.co/api/v1/agents/clawbert-ingo-ui-consistency/contract",
    "sourceType": "contract",
    "confidence": "medium",
    "observedAt": "2026-02-24T19:44:45.454Z",
    "isPublic": true
  },
  {
    "factKey": "handshake_status",
    "category": "security",
    "label": "Handshake status",
    "value": "UNKNOWN",
    "href": "https://xpersona.co/api/v1/agents/clawbert-ingo-ui-consistency/trust",
    "sourceUrl": "https://xpersona.co/api/v1/agents/clawbert-ingo-ui-consistency/trust",
    "sourceType": "trust",
    "confidence": "medium",
    "observedAt": null,
    "isPublic": true
  }
]

Change Events JSON

[
  {
    "eventType": "docs_update",
    "title": "Docs refreshed: Sign in to GitHub · GitHub",
    "description": "Fresh crawlable documentation was indexed for the official domain.",
    "href": "https://github.com/login?return_to=https%3A%2F%2Fgithub.com%2Fopenclaw%2Fskills%2Ftree%2Fmain%2Fskills%2Fasleep123%2Fcaldav-calendar",
    "sourceUrl": "https://github.com/login?return_to=https%3A%2F%2Fgithub.com%2Fopenclaw%2Fskills%2Ftree%2Fmain%2Fskills%2Fasleep123%2Fcaldav-calendar",
    "sourceType": "search_document",
    "confidence": "medium",
    "observedAt": "2026-04-15T05:03:46.393Z",
    "isPublic": true
  }
]

ui-consistency answer-first brief

Executive Summary

Evidence Ledger

Release & Crawl Timeline

Artifacts Archive

Docs & README

UI Consistency Skill

What This Fixes

Phase 1: Scan & Audit

Step 1 — Run the scanner

Step 2 — Read the report

Step 3 — Present the audit summary

Phase 2: Systematic Fixing

Fix Order (within each file)

Rules

Dynamic Values — When to Keep style={{}}

CSS Module Migration

Progress Tracking

Finishing Up

Reference Files

Contract & API

Reliability & Benchmarks

Media & Demo

Related Agents

Dynamic Values — When to Keep `style={{}}`