Agent skill that regenerates light-mode raster images as true dark-mode variants using gpt-image-2, for interface builders using Claude Code, Cursor, or Codex.
Qué hace
ui.sh Dark Mode Image is an agent skill that converts light-mode raster images into proper dark-mode variants using OpenAI's gpt-image-2 model via Codex. It preserves the original image's size, composition, and character rather than applying a CSS filter hack.
CSS filter: invert() is a shortcut, not a solution. It shifts hues, kills brand colors, and makes images look wrong on dark surfaces. ui.sh Dark Mode Image generates a genuine dark-mode variant of a raster image by handing the work off to OpenAI's gpt-image-2 model, so the result looks designed, not flipped.
ui.sh is a collection of agent skills built by Adam Wathan (creator of Tailwind CSS) and Steve Schoger (co-author of Refactoring UI). The skills install into whatever coding agent you already use: Claude Code, Cursor, Codex, OpenCode, or Amp. Dark Mode Image is the skill specifically for raster assets, sitting alongside Add Dark Mode (which handles code and component theming).
Install the skill through the ui.sh installer with your token, then invoke it with a single command pointing at a file: /dark-mode-image product-screenshot.png. The skill routes the image to Codex, which uses gpt-image-2 to produce a new version suited for dark backgrounds. Per the skill's own docs, it preserves the original's size, composition, softness, fades, and character.
This skill is raster-only. It covers screenshots, illustrations, product mockups, photos, backgrounds, and textures. It does not handle SVG or CSS-based assets. For component-level dark mode in code, the sibling skill Add Dark Mode is the right reach.
ui.sh is currently invite-only, and Wathan himself describes the current state as "uncomfortably early." The Dark Mode Image skill also has a hard model dependency: Codex with gpt-image-2. That requirement narrows which agent setups will work without additional configuration.
If your interface uses raster images and you're shipping dark mode, this skill removes one of the most tedious manual steps: producing adapted image assets that actually look right on dark surfaces. It's a narrow skill, but the problem it solves is real and the approach is fundamentally more correct than any CSS workaround.
Características
Notas de campo
Revisado el Jun 26, 2026
Ideal para
Resultados para creadores
Ten cuidado
Probado con
ui.sh Dark Mode Image is an agent skill that converts light-mode raster images into dark-mode variants using AI image generation. It runs through Codex, which uses OpenAI's gpt-image-2 model, and produces a new image file adapted for dark surfaces. Critically, it generates a real image asset rather than approximating the effect with a CSS filter, so the result preserves the original's composition, softness, and visual character.
Install it via the ui.sh npx installer by running `npx @uidotsh/install dark-mode-image --token=[your-token]`. Once installed, invoke it inside your coding agent with `/dark-mode-image <filename>` pointing at the raster image you want to adapt. You need a valid ui.sh token, which requires an invite, since the platform is currently invite-only.
The sources do not specify a price or license for this skill. Access to ui.sh requires an invite, and installation requires a token, suggesting it is not fully open. Pricing details are not publicly stated in the available documentation.
This skill is best for interface builders who have light-mode raster assets (screenshots, product mockups, illustrations, photos, backgrounds, or textures) that need proper dark-mode counterparts. It is the right tool when CSS filter hacks are producing unacceptable results and you need image files that look intentionally designed for a dark surface.
Dark Mode Image and Add Dark Mode solve different parts of the dark mode problem. Add Dark Mode works on UI code and component theming, handling color tokens, CSS variables, and Tailwind configuration. Dark Mode Image handles raster asset files specifically, regenerating the image itself for dark backgrounds. For a full dark mode implementation you would likely use both, reaching for Dark Mode Image only when raster assets are involved.
The skill only handles raster images: SVG files and CSS-based visuals are out of scope. It has a hard dependency on Codex with OpenAI's gpt-image-2 model, so agent setups that don't include that model won't work. Additionally, ui.sh is currently invite-only and described by its creator as 'uncomfortably early,' meaning the platform is actively evolving and some rough edges should be expected.
Una habilidad de IA que proporciona a los agentes de codificación inteligencia de diseño, reglas de razonamiento y estilos de interfaz para generar UI/UX profesional en distintas plataformas y frameworks.
Best for Arrancar un sistema de diseño a partir de la descripción de un proyecto.Una habilidad de diseño para Claude Code, Cursor y Codex que se niega a parecer generada por IA: elige una macroestructura para el encargo, aplica uno de veinte temas y ejecuta decenas de filtros anti-repetición antes de emitir el resultado.
Best for Diseñar UI que no parezca generada por IALa colección pública de Agent Skills de ejemplo para Claude de Anthropic: carpetas autocontenidas de instrucciones, scripts y recursos que abarcan tareas creativas, técnicas y empresariales, incluidas las skills de documentos que impulsan las capacidades de archivos de Claude.
Best for Aprender a crear Agent SkillsOpen-source collection of 45+ AI agent skills for marketing, CRO, SEO, copywriting, analytics, and growth, built for Claude Code, Cursor, and any Agent Skills-compatible agent.
Best for Technical marketers and founders using Claude Code, Cursor, Windsurf, or OpenAI Codex who want marketing domain knowledge baked inOpen-source PM skills marketplace: 68 AI skills and 42 workflows across 9 Claude plugins for product managers doing discovery, strategy, execution, and launch.
Best for PMs using Claude Code or Claude Cowork who want framework-driven decisions baked into daily AI workflowsA catalog of repeatable AI agent workflows with built-in feedback loops, plus an installable skill for finding, adapting, and designing your own loops.
Best for Teams using Codex, Cursor, or Claude Code who want agents to iterate reliably instead of making one-shot guesses