Skip to content
cccskills
FreePublished on GitHub

cxc-dev-frontend

Use for frontend code and UI fixes. Triggers: CSS, responsive, animation, React, Vue, Svelte, Tailwind, redesign, anti-slop, 프론트엔드, UI 작업, 반응형, 디자인 수정.

The English summary is being prepared. Showing the original description.

See how to install

Files included (56)

  • SKILL.md3.9 KB
  • agents/openai.yaml169 B
  • examples/README.md2.6 KB
  • references/core/a11y-patterns.md5.7 KB
  • references/core/aesthetics.md16.9 KB
  • references/core/anti-slop-enforcement.md6.0 KB
  • references/core/anti-slop.md27.1 KB
  • references/core/asset-requirements.md24.3 KB
  • references/core/backend-contracts.md1.9 KB
  • references/core/brand-asset-sourcing.md4.0 KB
  • references/core/color-system.md5.7 KB
  • references/core/consistency-locks.md850 B
  • references/core/content-surface-pipeline.md7.2 KB
  • references/core/crud-ui.md2.5 KB
  • references/core/design-intake.md4.4 KB
  • references/core/dropdown-layer.md5.8 KB
  • references/core/i18n-global.md3.1 KB
  • references/core/implementation.md4.1 KB
  • references/core/iterative-design.md4.4 KB
  • references/core/korea-2026.md8.7 KB
  • references/core/layout-discipline.md10.6 KB
  • references/core/liquid-glass.md8.5 KB
  • references/core/logo-sections.md5.5 KB
  • references/core/mobile-ux.md6.1 KB
  • references/core/motion.md41.4 KB
  • references/core/performance-budget.md4.4 KB
  • references/core/platform-runtime.md4.9 KB
  • references/core/preflight-full.md3.6 KB
  • references/core/product-density.md1.9 KB
  • references/core/prototype-variants.md2.2 KB
  • references/core/reference-capture.md5.5 KB
  • references/core/render-grounding.md494 B
  • references/core/responsive-viewport.md5.4 KB
  • references/core/role-boundaries.md1.0 KB
  • references/core/routing-defaults.md943 B
  • references/core/section-level-sourcing.md8.7 KB
  • references/core/seo-baseline.md4.4 KB
  • references/core/soft-3d-asset-gates.md2.1 KB
  • references/core/theme-switching.md2.1 KB
  • references/core/token-source-divergence.md5.2 KB
  • references/core/top-bar.md5.5 KB
  • references/core/topic-index.md7.5 KB
  • references/core/typography-wrapping.md9.3 KB
  • references/core/ux-writing-ko.md2.3 KB
  • references/core/visual-verification.md7.2 KB
  • references/stack-index.md1.3 KB
  • references/stacks/astro.md8.1 KB
  • references/stacks/mobile-native.md10.9 KB
  • references/stacks/nextjs.md5.7 KB
  • references/stacks/react.md8.6 KB
  • references/stacks/svelte.md8.4 KB
  • references/stacks/vanilla.md5.1 KB
  • scripts/bundle-artifact.sh1.5 KB
  • scripts/init-artifact.sh6.8 KB
  • scripts/README.md1.6 KB
  • scripts/shadcn-components.tar.gz19.5 KB

SKILL.md (original)

Review the instructions the agent will receive before you install.

Dev-Frontend — Domain-Correct Frontend Engineering

Build production-grade frontend implementations from an established product/design direction. This skill owns HTML/CSS/component/runtime implementation, responsive behavior, accessibility wiring, visual verification, and frontend platform rules.

Before selecting depth or claiming completion, read dev and its verification gate. For current/external evidence, use dev’s conditional routes.

Modular References

ConditionReference
Every frontend change: role boundaryRole boundaries
Before designing or coding: surface defaultsRouting defaults
C2 list/detail/form screensCRUD UI
Marketing/visual surfaces or C3+: choose topic/locale referencesCore topic index
Framework implementation or configurationStack index
Components, direction intake, dials or objective/style classificationDesign intake
Typography, color, layout, assets, icons or cutoutsImplementation
New/redesigned surfaces or visual auditsAnti-slop enforcement
Performance, accessibility, forms, state, platform or errorsPlatform and runtime
API consumption, security UI or contract fixturesBackend contracts
Any render/executable frontend artifactVerification grounding
Before shipping a production frontend surface at C2+Full pre-flight

Start with references/core/anti-slop.md, references/core/aesthetics.md, references/core/responsive-viewport.md, and references/core/visual-verification.md. Add domain/locale/stack references only when relevant. For C2 ordinary app screens (form/table/list/detail), references/core/crud-ui.md alone suffices; add the style references above for marketing/visual surfaces or C3+ work.

  • UI/rendering bug RCA: load dev-debugging.
  • Build pipeline, bundle config, or deployment: load dev-devops.
  • Project setup or file placement conventions: load dev-scaffolding.
  • Data-driven dashboards, reporting views, or data format expectations: load dev-data.

0. Frontend Routing

Before designing or coding, classify the work:

DecisionOptionsWhy It Matters
Product surfacelanding, app, dashboard, AI tool, public service, education, game, creativeSets density, typography scale, asset requirements
LocaleKorean-first, global/i18n, English-onlySets CJK typography, copy, date/number formats
Densitycampaign, consumer app, productivity, SaaS, ops, finance, developer consolePrevents landing-page composition inside repeated-work tools
Asset neednone, screenshot, product photo, diagram, chart, illustration, soft 3D, game assetPrevents asset-free gradient/card UI
Soft 3D/character gatenot allowed, subtle, primaryPrevents generic cute 3D/mascot slop
Motion intensitystatic, feedback-only, expressive, cinematicPrevents cinematic motion in utility workflows

Reviews

No reviews yet. Tell others what you thought.

Comments

No login needed. Share how it worked for you, ask a question, or note where it did not run.

No comments yet. Be the first to write one.

Comments are published right away. Do not include personal information such as email addresses or phone numbers. Up to 2 URLs.

0 / 1,000 characters

This form is protected by reCAPTCHA, and the Google Privacy Policy and Terms of Service apply.

More skills from this repository

Use for AST search and codemods. Triggers: ast-grep, sg, function/call/class/import, empty catch, missing await, YAML rules.

The English summary is being prepared. Showing the original description.

lidge-jun/codexclaw47Updated Oct 9, 2026

Use for coding, PR delivery, scaffolding and QA. Triggers: develop, fix, refactor, test, review, docs, browse, stacked PR, 개발, 수정, 검토, 스택 PR.

The English summary is being prepared. Showing the original description.

lidge-jun/codexclaw47Updated Oct 9, 2026

Use for module boundaries and dependencies. Triggers: circular import, coupling, barrel, re-export, validation placement, 모듈 경계, 순환 참조.

The English summary is being prepared. Showing the original description.

lidge-jun/codexclaw47Updated Oct 9, 2026

Use for APIs, servers and app databases. Triggers: REST, GraphQL, migration, query optimization, middleware, caching, queues, 백엔드, API 작업, 마이그레이션, 쿼리 최적화.

The English summary is being prepared. Showing the original description.

lidge-jun/codexclaw47Updated Oct 9, 2026

Use for code/PR/diff review and refactor audits. Triggers: review this, before merge, antipattern, 리뷰, 코드 리뷰, 머지 전에 확인.

The English summary is being prepared. Showing the original description.

lidge-jun/codexclaw47Updated Oct 9, 2026

Use for analytics and data pipelines. Triggers: ETL, ELT, data quality, SQL optimization, schema drift, backfill, 데이터 파이프라인, 데이터 품질, 백필.

The English summary is being prepared. Showing the original description.

lidge-jun/codexclaw47Updated Oct 9, 2026

See all skills by lidge-jun

Report a problem with this skill