Responsive Units
thedaviddias/Front-End-Checklist
A skill your agent uses when reviewing stylesheets, component styles, and responsive behavior related to Use relative units for responsive layouts.
Guide for customizing OhMyCode's terminal output style and rendering.
$ npx skills add AlphaLab-USTC/OhMyCode --skill customize-response-style -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install AlphaLab-USTC/OhMyCode customize-response-style --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/AlphaLab-USTC/OhMyCode.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/customize-response-style .claude/skills/customize-response-style && rm -rf skills-srcUse ~/.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/
Install the "customize-response-style" agent skill from https://github.com/AlphaLab-USTC/OhMyCode/tree/main/.agents/skills/customize-response-style into .claude/skills/customize-response-style/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "customize-response-style", 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 install https://github.com/AlphaLab-USTC/OhMyCode/tree/main/.agents/skills/customize-response-styleType 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.
$ npx skills add AlphaLab-USTC/OhMyCode --skill customize-response-style -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install AlphaLab-USTC/OhMyCode customize-response-style --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/AlphaLab-USTC/OhMyCode.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.agents/skills/customize-response-style .agents/skills/customize-response-style && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "customize-response-style" agent skill from https://github.com/AlphaLab-USTC/OhMyCode/tree/main/.agents/skills/customize-response-style into .agents/skills/customize-response-style/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "customize-response-style", 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.
$ npx skills add AlphaLab-USTC/OhMyCode --skill customize-response-style -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install AlphaLab-USTC/OhMyCode customize-response-style --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/AlphaLab-USTC/OhMyCode.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.agents/skills/customize-response-style .cursor/skills/customize-response-style && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "customize-response-style" agent skill from https://github.com/AlphaLab-USTC/OhMyCode/tree/main/.agents/skills/customize-response-style into .cursor/skills/customize-response-style/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "customize-response-style", 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 https://github.com/AlphaLab-USTC/OhMyCode.git --path .agents/skills/customize-response-style--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add AlphaLab-USTC/OhMyCode --skill customize-response-style -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install AlphaLab-USTC/OhMyCode customize-response-style --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/AlphaLab-USTC/OhMyCode.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.agents/skills/customize-response-style .gemini/skills/customize-response-style && rm -rf skills-srcUse ~/.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/
Install the "customize-response-style" agent skill from https://github.com/AlphaLab-USTC/OhMyCode/tree/main/.agents/skills/customize-response-style into .gemini/skills/customize-response-style/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "customize-response-style", 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.
$ gh skill install AlphaLab-USTC/OhMyCode customize-response-styleInstalls 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).
$ npx skills add AlphaLab-USTC/OhMyCode --skill customize-response-style -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/AlphaLab-USTC/OhMyCode.git skills-src && mkdir -p .github/skills && cp -r skills-src/.agents/skills/customize-response-style .github/skills/customize-response-style && rm -rf skills-srcUse ~/.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/
Install the "customize-response-style" agent skill from https://github.com/AlphaLab-USTC/OhMyCode/tree/main/.agents/skills/customize-response-style into .github/skills/customize-response-style/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "customize-response-style", 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.
$ npx skills add AlphaLab-USTC/OhMyCode --skill customize-response-style -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install AlphaLab-USTC/OhMyCode customize-response-style --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/AlphaLab-USTC/OhMyCode.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.agents/skills/customize-response-style .opencode/skills/customize-response-style && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "customize-response-style" agent skill from https://github.com/AlphaLab-USTC/OhMyCode/tree/main/.agents/skills/customize-response-style into .opencode/skills/customize-response-style/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "customize-response-style", 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.
customize-response-styleGuide for customizing OhMyCode's terminal output style and rendering.
Customize Response Style is an agent skill from AlphaLab-USTC/OhMyCode. Guide for customizing OhMyCode's terminal output style and rendering. Use when user wants to change colors, formatting, or how responses look in the terminal.
Its SKILL.md is about 1.1k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.
The repository describes itself as: Minimal and Customizable CC-Style Coding Agent. The licence is MIT.
4 steps, taken from the first numbered list in SKILL.md.
Read from SKILL.md and the folder at commit 4d1bb28. It shows what the files ask for, not the result of running them.
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.
Shell commands in SKILL.md call:
python3From the folder's file list and the shell code blocks in SKILL.md.
Links to these hosts (documentation or services it may open):
rich.readthedocs.ioFrom URLs in SKILL.md, links to its own repository left out.
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Customize Response Style loads about 1.1k tokens when it runs. Until then it costs about 46 tokens; SKILL.md has 373 words of instructions outside code blocks.
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.
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.
The full file from AlphaLab-USTC/OhMyCode at commit 4d1bb28, republished under its MIT licence (© AlphaLab-USTC). 373 words, ~1,138 tokens.
.claude/skills/customize-response-style/SKILL.md (or your agent's skills folder).Change how OhMyCode renders output in the terminal — colors, formatting, tool call display, token usage display.
All rendering logic is in ohmycode/cli.py → render_stream() function. It consumes events from the conversation loop and prints them using rich.console.Console.
Current rendering:
| Event | Current Style |
|---|---|
TextChunk | Plain text, streamed character by character |
ToolCallStart | ▶ <tool_name> in cyan + params in dim |
ToolCallResult (success) | ✓ + green output (truncated to 500 chars) |
ToolCallResult (error) | ✗ + red error message |
TurnComplete | Tokens: prompt=X completion=Y total=Z in dim |
Open ohmycode/cli.py and find async def render_stream(). Modify the rich markup:
# Change tool call header color from cyan to blue
console.print(f"\n[blue]▶ {event.tool_name}[/blue]", highlight=False)
# Add a box around tool results
from rich.panel import Panel
console.print(Panel(output, title="Tool Result", border_style="green"))
# Hide token usage
# Comment out or delete the TurnComplete rendering blockCreate a custom theme at the top of cli.py:
from rich.theme import Theme
ohmycode_theme = Theme({
"tool.name": "bold magenta",
"tool.success": "green",
"tool.error": "bold red",
"tool.params": "dim italic",
"status": "dim cyan",
"prompt": "bold yellow",
})
console = Console(theme=ohmycode_theme)Then use style names in print calls:
console.print(f"▶ {event.tool_name}", style="tool.name")Replace plain text streaming with rich Markdown rendering:
from rich.markdown import Markdown
# In render_stream(), after collecting all TextChunks for a turn:
if collected_text:
console.print(Markdown(collected_text))Trade-off: Markdown rendering requires buffering the full response (no streaming feel). A hybrid approach: stream plain text, then re-render as Markdown after the turn completes.
In run_repl(), change the prompt appearance:
# Simple change
user_input = session.prompt("ohmycode> ")
# With color (prompt_toolkit style)
from prompt_toolkit.formatted_text import HTML
user_input = session.prompt(HTML("<ansigreen>ohmycode</ansigreen><ansiyellow>></ansiyellow> "))
# With model name
user_input = session.prompt(f"[{config.model}]> ")| Change | Where | Difficulty |
|---|---|---|
| Change colors | render_stream() rich markup | Easy |
| Add panels/borders around tool results | render_stream() + rich.Panel | Easy |
| Show full tool params (not truncated) | render_stream() truncation logic | Easy |
| Hide token usage | render_stream() TurnComplete block | Easy |
| Add timestamps to output | render_stream() | Easy |
| Markdown rendering | render_stream() + rich.Markdown | Medium |
| Custom REPL prompt | run_repl() prompt_toolkit config | Medium |
| Add spinner during tool execution | render_stream() + rich.Status | Medium |
| Progress bar for long operations | render_stream() + rich.Progress | Medium |
| Split-pane layout (output + status) | rich.Layout | Hard |
After modifying cli.py:
ohmycode -p "List python files here" --mode autoohmycode -p "Read pyproject.toml" --mode autoohmycode -p "Read /nonexistent/file" --mode autoohmycode → type a message → /exitrich documentation: https://rich.readthedocs.io/python3 -c "from rich import print; print('[bold red]Red[/bold red] [green]Green[/green]')"render_stream() — don't modify core/loop.py for display concernsprompt_toolkit, not rich — they have different styling systems© AlphaLab-USTC, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Just SKILL.md in .agents/skills/customize-response-style of AlphaLab-USTC/OhMyCode.
Open the folder on GitHubat commit 4d1bb28
Customize Response Style 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.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Customize Response Style this skillAlphaLab-USTC/OhMyCode | 131 | — | ~1.1k | Automated safety check: Pass | MIT | |
| Responsive Unitsthedaviddias/Front-End-Checklist | 74k | — | ~472 | Automated safety check: Pass | MIT | |
| CSS Custom Propertiesthedaviddias/Front-End-Checklist | 74k | — | ~492 | Automated safety check: Pass | MIT | |
| Responsive Imagesthedaviddias/Front-End-Checklist | 74k | — | ~403 | Automated safety check: Pass | MIT | |
| Customs and Trade Complianceaffaan-m/ECC | 276k | 5 repos | ~7.2k | Automated safety check: Pass | Apache-2.0 | |
| Responsive Designwshobson/agents | 40k | 2 repos | ~498 | Automated safety check: Pass | MIT |
thedaviddias/Front-End-Checklist
A skill your agent uses when reviewing stylesheets, component styles, and responsive behavior related to Use relative units for responsive layouts.
thedaviddias/Front-End-Checklist
A skill your agent uses when reviewing stylesheets, component styles, and responsive behavior related to Use CSS custom properties for design tokens.
thedaviddias/Front-End-Checklist
A skill your agent uses when reviewing article images, cards, galleries, or any component rendered at multiple sizes across breakpoints.
affaan-m/ECC
Covers customs work: HS and HTS tariff classification, entry documents, Incoterms, FTA duty savings, denied-party screening and responses to audits and penalty notices.
wshobson/agents
Implement modern responsive layouts using container queries, fluid typography, CSS Grid, and mobile-first breakpoint strategies.
affaan-m/ECC
Open an executable and its argument array in a visible terminal window through a reusable, shell-free launch plan with dry-run, JSON, capability detection, detached fallback, and standalone recovery…
AlphaLab-USTC/OhMyCode
Guide for adding a new feature to OhMyCode. An agent skill from AlphaLab-USTC/OhMyCode.
AlphaLab-USTC/OhMyCode
Guide for adding a new LLM provider to OhMyCode. An agent skill from AlphaLab-USTC/OhMyCode.
AlphaLab-USTC/OhMyCode
Guide for adding a new tool to OhMyCode. An agent skill from AlphaLab-USTC/OhMyCode.
AlphaLab-USTC/OhMyCode
Run OhMyCode benchmarks — score any provider/model with token tracking.
AlphaLab-USTC/OhMyCode
Guide for customizing OhMyCode's AI personality and behavior via system prompt.
AlphaLab-USTC/OhMyCode
Guide for debugging OhMyCode issues. An agent skill from AlphaLab-USTC/OhMyCode.
Guide for customizing OhMyCode's terminal output style and rendering. Customize Response Style is an agent skill from AlphaLab-USTC/OhMyCode. Guide for customizing OhMyCode's terminal output style and rendering.
Customize Response Style fits situations like: user wants to change colors; how responses look in the terminal.
Run `npx skills add AlphaLab-USTC/OhMyCode --skill customize-response-style -a claude-code`. Or copy the skill folder (.agents/skills/customize-response-style in AlphaLab-USTC/OhMyCode) into .claude/skills/customize-response-style in your project. Claude Code loads it when a task matches its description.
Run `npx skills add AlphaLab-USTC/OhMyCode --skill customize-response-style -a codex`. Or copy the skill folder (.agents/skills/customize-response-style in AlphaLab-USTC/OhMyCode) into .agents/skills/customize-response-style in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add AlphaLab-USTC/OhMyCode --skill customize-response-style -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/customize-response-style, .gemini/skills/customize-response-style, .github/skills/customize-response-style and .opencode/skills/customize-response-style in your project.
Going by SKILL.md and its folder, Customize Response Style needs the command-line tools its instructions call (python3). Our summary lists: Python 3.
SKILL.md names 1 domain. As links in the text: rich.readthedocs.io. This is read from the text; nothing was executed.
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.
Customize Response Style is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
About 1.1k tokens (SKILL.md is roughly 4.6k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
Skills that share tags, products or a category with Customize Response Style: Responsive Units (thedaviddias/Front-End-Checklist, 74k stars), CSS Custom Properties (thedaviddias/Front-End-Checklist, 74k stars), Responsive Images (thedaviddias/Front-End-Checklist, 74k stars) and Customs and Trade Compliance (affaan-m/ECC, 276k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
AlphaLab-USTC (a GitHub user) maintains it in AlphaLab-USTC/OhMyCode, which has 131 GitHub stars. The repository holds 10 skills in this directory. The repository was last updated on April 2, 2026.
Source: AlphaLab-USTC/OhMyCode on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.