Auric Artisan Plugins User Guide

The plugins suite is built for practical color decisions inside daily tools. Figma, Penpot and Sketch work on selected design layers. VS Code works on colors, markup and code in source files and across the workspace. Alfred and Raycast provide fast system-wide contrast checks. The bot worker brings the same contrast logic to Slack and Discord and can publish Color of the Day posts to social targets.

• Use a design plugin when the question is "Which layers in this file fail contrast?"
• Use VS Code when the question is "Does this code contain failing color pairs, WCAG problems or leftover secrets?"
• Use Alfred or Raycast when the question is "What is the contrast between these two colors?"
• Use Slack or Discord when a team needs a shared, timestamped contrast answer in a channel.
• Use the Color of the Day bot when publishing scheduled brand content from the same public color data used by the site.

The plugins are intentionally small and focused. They do not replace the full Auric Artisan web tools; they bring the highest-frequency color checks into the editor, design canvas or chat context where you already are.

The Figma plugin is a local design-panel workflow with four menu commands: Audit selection, Generate accessible palette, Fix failing pair and Vision sim preview. The panel opens at 360 by 560 pixels and shows the current selection count.

If nothing is selected, the audit scope falls back to the current page. The plugin estimates effective background by walking parent fills and page backgrounds, then reports WCAG ratio and APCA Lc for failing pairs.

The Penpot plugin mirrors the Figma workflow, with Penpot-specific shape APIs and a status pill inside the iframe UI. It asks for content:write so it can apply palettes, draw outlines and auto-fix fills, and user:read for the plugin host context.

• Run Audit to scan selected shapes or the current page.
• Use Outline failing to draw red dashed rectangles around failing shapes.
• Use Clear outlines before handing off or exporting a file.
• Generate palettes from a typed seed, selected fill or default blue seed.
• Use Fix all failing after reviewing the list so changed colors are intentional.

Penpot text contrast is the dominant v1 audit path. Fill-vs-stroke checks are not the main Penpot focus in this version, so use visual review for non-text UI details after running the text audit.

The Sketch plugin installs as Auric Artisan.sketchplugin and exposes an Auric Artisan menu with four commands. It supports Sketch compatible version 94 and newer.

The Sketch plugin works directly with layer colors. Always review auto-fixed colors before final export because the tool is optimizing contrast, not preserving brand color intent.

Auric Artisan — Color, Accessibility & Code Health (version 0.13.2) checks colors, accessibility and code health while you write, and grades the whole workspace. It runs locally, with no account and no network access, and needs VS Code 1.74 or newer. A packaged build installs with Extensions: Install from VSIX.

It starts when you open a CSS-family, JavaScript, TypeScript, React, HTML, Vue, Svelte, Astro, PHP, JSON, JSONC, Markdown or XML file, open its Accessibility Issues view, or run one of its commands. Color hovers, swatches and the picker also work in many other languages, such as Python, Go, Rust, YAML and TOML.

• Hover a color: RGB, HSL, OKLCH and Display-P3 values, the nearest CSS name, contrast against white and black, and a color-vision preview.
• Pick a color: the Auric picker (spectrum, hue and alpha, eyedropper, brand and recent swatches, WCAG and APCA readouts) opens from a swatch's hover, the right-click menu or Ctrl+Alt+C (Cmd+Alt+C on macOS) and writes the color back in the format you choose. Set auricArtisan.colorPicker.mode to decorators to use VS Code's own picker instead; Restore native color picker hands the picker back to VS Code in one step.
• Inspect: hover an element or a CSS rule, or press Ctrl+Alt+A (Cmd+Alt+A), to see its accessible name and role, the colors that apply, the contrast verdict with APCA and a color-vision check, a before and after preview, and the WCAG issues found there.
• Contrast diagnostics: color and background pairs that can be read from the source, in stylesheets, style blocks, inline styles, CSS-in-JS and framework style bindings, including var() tokens, are checked against auricArtisan.contrast.threshold. A failing pair is underlined with a Fix contrast quick fix, and Fix All Contrast Issues in File shows every change before applying them as one undoable edit.
• WCAG checks: 62 markup and CSS rules across 28 WCAG success criteria, under the profile in auricArtisan.a11y.profile (2.0, 2.1, 2.2 or 3.0-draft). Each finding names its success criterion and level and suggests a fix; only fixes that are safe to make automatically are applied for you.
• Code Health: in any language, it flags likely hardcoded secrets, security footguns such as disabled TLS checks, weak crypto and injection, risky APIs, debug leftovers, merge-conflict markers, TODO and FIXME markers, and oversized files. Each check has its own auricArtisan.codeHealth.* switch.
• Suppress a finding: add an auric-disable-line, auric-disable-next-line or auric-disable-file comment; the quick fix inserts the right one for the language.
• Scan the workspace: Scan Project for Accessibility gives the workspace a 0 to 100 score and a letter grade, and lists every finding in the Accessibility Issues view, where you can search and group them by type, file or severity. The Overview panel in the activity bar shows the score, and auricArtisan.scan.live updates it as you type.
• The Studio: Open Color & Accessibility Studio has eight tabs: Scan, Contrast, Preview, Brand, Palette, Shades, Vision and Settings.
• Reports: Generate Project Health Report opens one report for color, accessibility and code health. Write Health Record writes health.json, a SARIF 2.1.0 file and a trend history to the workspace .auric-artisan folder, and Generate Agent-Ready Remediation Plan writes a Markdown and JSON fix plan there.
• In CI: the same engine runs without the editor as auric-artisan scan, with --json, --sarif, --baseline, --fail-on, --max-new and --min-score. It exits with 0 on a pass, 1 on a policy violation and 2 on an error.

The extension has 23 commands and 46 settings; the Plugins Developer Reference lists them all. A 1.0.0 build, not yet released, splits it into Auric Color, Auric Accessibility and Auric Code Health, with Auric Artisan becoming a pack that installs all three. Its command and setting names move to new prefixes, such as auricA11y.scanProject and auricColor.contrast.threshold, so custom keybindings and settings will need updating.

The Alfred workflow is a fast local contrast checker for macOS. Install the Auric Artisan.alfredworkflow bundle, then trigger Alfred and type:

aa contrast #222 #fff
aa contrast red goldenrod
aa contrast "rgb(30 41 59)" "#fff"

• The first result copies the WCAG ratio.
• The APCA row copies the numeric Lc value.
• Foreground and background rows copy normalized HEX values.
• The summary row copies foreground, background, WCAG and APCA together.
• Node.js 18 or newer must be available on your PATH.

The Raycast extension exposes a single Check Contrast command. Provide foreground and background arguments and Raycast opens a detail view with live preview, metadata and copy actions.

• Copy Ratio copies a value such as 4.72:1.
• Copy Summary copies normalized colors plus WCAG and APCA verdicts.
• Copy Foreground HEX uses cmd+f.
• Copy Background HEX uses cmd+b.
• The detail view shows nearest CSS names, RGB, HSL, WCAG body, WCAG large, AAA and APCA verdicts.

Like Alfred, Raycast runs locally. It does not require an API key or an Auric Artisan account for contrast checks.

The bot worker gives teams shared contrast answers in chat. Slack sends a signed slash-command request to POST /slack. Discord sends signed interactions to POST /discord. Both call the same contrast handler.

Use the query format that humans already use: #222 #fff, red goldenrod or rgb(30 41 59) white.

The social bot reads the public Color of the Day source, derives the same daily color as the website widget and posts to configured targets. The Cloudflare cron is set to 30 3 * * *, which is 09:00 in Asia/Kolkata.

• GET /social/color-of-day/preview returns the exact post text without publishing.
• POST /social/color-of-day publishes when authorized and enabled.
• Manual publishing accepts Authorization: Bearer <SOCIAL_POST_SECRET> or x-auric-social-secret.
• Targets include Slack webhook, Discord webhook, Mastodon, X and a generic JSON webhook.
• Each target gets one post per day. Add ?dry_run=1 to preview through the publish route, or ?force=1 to post again on a day that already has a post.
• GET /social/x/verify checks the configured X account, and POST /social/x/selftest publishes a throwaway X post and deletes it (?keep=1 keeps it). Both need the same secret.
• Keep SOCIAL_POST_DRY_RUN=1 until target credentials and copy are verified.

Posting is off in the committed plugins/bots/wrangler.toml: SOCIAL_POST_ENABLED is 0 and SOCIAL_POST_DRY_RUN is 1.

Set SOCIAL_POST_ENABLED=1 only after previewing the post and confirming that at least one target is configured.

Launcher, editor and bot parsers share the same practical input vocabulary. The exact platform UI differs, but the expected color syntax is consistent.

Design plugins mostly read colors from the host document. Palette generators accept seed and background HEX values in their UI prompts or inputs.

• WCAG ratio compares relative luminance. Body text typically targets 4.5:1, large text and UI targets often use 3.0:1, and AAA body targets 7.0:1.
• APCA Lc is polarity-aware. Higher absolute values indicate stronger perceived contrast under the simplified plugin implementation.
• Nearest CSS name is a convenience label, not a design-token recommendation.
• Nudged colors were moved to improve contrast. They should be reviewed against brand requirements.
• Vision simulation previews confusion risk; it does not replace numeric contrast checks.

The design, editor and launcher plugins run locally in their host applications. They inspect the selected document, active source file or typed colors and do not need remote Auric Artisan API calls for contrast results.

• Figma declares no network access domains.
• Penpot needs write permission for outlines, palette application and color fixes.
• VS Code scans text documents in supported languages, caps color-provider work on large files, and writes its scan cache and reports only to the workspace .auric-artisan folder.
• Slack and Discord requests are verified before processing.
• Social posting uses target credentials and should stay in dry-run mode until reviewed.

1. Use Figma, Penpot or Sketch before design handoff to audit selected components and frames.
2. Generate accessible palette candidates from the design plugin when a palette needs local correction.
3. Preview color-vision states for product-critical color coding, charts, badges and alerts.
4. Use VS Code during implementation to catch failing color pairs, WCAG problems and code-health findings, and run the auric-artisan scan CLI on pull requests.
5. Use Alfred, Raycast, Slack or Discord for quick pair checks during reviews.
6. Keep social posting in preview or dry-run mode until brand, copy and targets are approved.

For implementation and release details, see the Plugins Developer Reference.