Skip to content
Back to skills

Ui Component

ASecurity

Generate standalone HTML/CSS components: forms, cards, modals. Use when picking palettes, choosing fonts, laying out grids, adjusting spacing.

  • 12 stars
  • 0 votes
  • 0 copies
  • 2 views
  • Added September 7, 2026
toolsbashgit

Security analysis

A100/100

Pro scans all 4 files and shows the line behind each finding

Scanned September 7, 2026

npx -y skills add bytesagain/ai-skills --skill ui-component --agent claude-code

Installs into .claude/skills of the current project.

Are you the author of Ui Component?

Add the live security badge to your README. It updates with every re-scan.

Security grade badge for Ui Component
[![Security: A — Skills Directory](https://www.skillsdirectory.com/api/skills/bytesagain-ui-component/badge)](https://www.skillsdirectory.com/skills/bytesagain-ui-component)

More formats (shields.io, HTML) on the badges page. Keep it an A: scan every change in CI with Pro.

Download with Pro
SKILL.md
---
version: "2.0.0"
name: ui-component
description: "Generate standalone HTML/CSS components: forms, cards, modals. Use when picking palettes, choosing fonts, laying out grids, adjusting spacing."
author: BytesAgain
homepage: https://bytesagain.com
source: https://github.com/bytesagain/ai-skills
---
# ui-component

UI组件HTML/CSS代码生成。表单、表格、卡片、模态框、导航栏,输出完整可运行HTML文件。UI component generator: form, table, card, modal, navbar as standalone HTML files.

## 核心特点

🎯 **精准** — 针对具体场景定制化输出
📋 **全面** — 多个命令覆盖完整工作流
🇨🇳 **本土化** — 完全适配中文用户习惯

## 可用命令

- **generate** — generate
- **form** — form
- **table** — table
- **card** — card
- **modal** — modal
- **navbar** — navbar

## 专业建议

- 一致性** — 同一项目使用统一的圆角、间距、配色
- 可访问性** — 表单加label,按钮有焦点样式,对比度达标
- 响应式** — 移动端优先,用相对单位(rem/%)
- 简洁** — 少即是多,不加无意义装饰
- | 需求 | 推荐命令 |

---
*ui-component by BytesAgain*
---
💬 Feedback & Feature Requests: https://bytesagain.com/feedback
Powered by BytesAgain | bytesagain.com

## Examples

```bash
# Show help
ui-component help

# Run
ui-component run
```

- Run `ui-component help` for all commands

## Commands

Run `ui-component help` to see all available commands.

Files in this skill

  • SKILL.md1.5 KB
  • scripts/script.sh2.5 KB
  • scripts/ui.sh15.9 KB
  • tips.md1.2 KB

Attribution

Is this your skill, or is something wrong with this listing? Request removal or report an issue. Author removals are honored within 72 hours.

Comments

Loading comments…