Run any Skill in Manus with one click

web-design-guidelines

Stars3

Forks0

UpdatedMarch 10, 2026 at 22:04

Review a website or app UI against modern web interface guidelines. Use when the agent is building or auditing layout, accessibility, forms, interaction states, or overall UX quality.

Installation

Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.

Run Skill in Manus

Source

gambarian-cloud

gambarian-cloud/codex-claude-code-starter-pack

View GitHub Repository View Creator Repositories

Download

Run Skill in Manus

Related occupationsSOC

Based on SOC occupation classification

Web and Digital Interface DesignersComputer and Mathematical Occupations·SOC 15-1255

SKILL.md

readonly

name	web-design-guidelines
description	Review a website or app UI against modern web interface guidelines. Use when the agent is building or auditing layout, accessibility, forms, interaction states, or overall UX quality.

Web Design Guidelines

Use this skill when the project has a real user-facing web interface.

Workflow

Review the visible layout, spacing, hierarchy, and navigation before polishing code details.
Check that forms, buttons, links, and empty states are easy to understand.
Make loading, error, success, hover, focus, and disabled states explicit.
Keep typography, contrast, and spacing comfortable on desktop and mobile.
Call out accessibility problems early instead of treating them as optional cleanup.

Guardrails

Do not ship a UI that only looks acceptable on one screen size.
Do not hide key actions behind clever interactions or weak contrast.
Prefer clear, calm, readable interfaces over flashy but confusing design.

More from this repository

same repository

deep-research

gambarian-cloud/codex-claude-code-starter-pack

Run a decision-grade, multi-source research pass that verifies claims across official docs, implementation evidence, field evidence, and counter-evidence, then turns them into a source-backed memo or an adopt/experiment/watch/reject decision. Use when the task needs multiple source layers, counter-evidence, contradiction handling, or a source-of-truth comparison across tools, vendors, workflows, repos, standards, or market/technical claims. Do not use for quick fact lookup, a single-doc answer, routine digest review, simple feature comparison, code review, or implementation-only work.

2026-03-243

hebrew-pdf-to-markdown

gambarian-cloud/codex-claude-code-starter-pack

Convert scanned Hebrew or mixed Hebrew-English PDFs into source-faithful Markdown with RTL-safe structure, page-level provenance, uncertainty tracking, and OCR QA. Use when Codex needs to read Hebrew PDFs, especially scanned, rotated, or medical documents, and preserve wording, dates, tables, dosages, and mixed-direction text instead of producing only a summary.

2026-03-223

design-elevation

gambarian-cloud/codex-claude-code-starter-pack

Elevate the visual quality of websites, apps, dashboards, presentations, and other visual outputs after the first functional pass. Use when the output works but still feels generic, flat, confusing, or unfinished.

2026-03-193

frontend-design

gambarian-cloud/codex-claude-code-starter-pack

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.

2026-03-193

presentations

gambarian-cloud/codex-claude-code-starter-pack

Use when the user wants a presentation, slide deck, lesson slides, business deck, PowerPoint, or a short visual talk. Create a clear outline first, then build a simple deck that is easy to read and present.

2026-03-103

playwright

gambarian-cloud/codex-claude-code-starter-pack

Use when the user wants to open a real site or app in a browser, click through it, take screenshots, verify a flow, or debug what the UI actually does.

2026-03-103

Run any Skill with one click