chakra-ui
Compare original and translation side by side
🇺🇸
Original
English🇨🇳
Translation
ChineseChakra UI v3 リファレンス
Chakra UI v3 参考文档
Chakra UI v3 公式ドキュメントを網羅したスキル。
タスクからカテゴリを引き、カテゴリの README.md で目的のページを特定すること。
本技能涵盖Chakra UI v3官方文档的全部内容。请根据任务匹配对应分类，通过分类下的README.md定位目标页面。
ディレクトリ構成
目录结构
text
skills/chakra-ui/
SKILL.md
references/
get-started/
README.md
ai-llms.md
ai-mcp-server.md
ai-skills.md
changelog.md
cli.md
contributing.md
env-iframe.md
env-shadow-dom.md
figma.md
framework-next-app.md
framework-next-pages.md
framework-remix.md
framework-storybook.md
framework-tanstack-router.md
framework-vite.md
installation.md
migration.md
playground.md
components/
README.md
concepts/
layout/
typography/
buttons/
date-time/
forms/
collections/
overlays/
disclosure/
feedback/
data-display/
i18n/
utilities/
charts/
README.md
installation.md
area-chart.md
bar-chart.md
bar-list.md
bar-segment.md
axes.md
cartesian-grid.md
donut-chart.md
legend.md
line-chart.md
pie-chart.md
radar-chart.md
scatter-chart.md
sparkline.md
tooltip.md
use-chart.md
styling/
README.md
concepts/
compositions/
style-props/
theming/
README.md
concepts/
design-tokens/
compositions/
customization/
blocks/
README.md
ai.md
app-headers.md
app-integrations.md
app-navbars.md
authentication.md
banners.md
blogs.md
cards.md
careers.md
charts.md
contacts.md
cta.md
dividers.md
docs-changelog.md
docs-code-block.md
docs-example-preview.md
docs-header.md
docs-navbar.md
docs-pagination.md
docs-parameter-field.md
docs-sidebar.md
docs-step.md
docs-toc.md
faqs.md
features.md
feeds.md
footers.md
help-center.md
heroes.md
layouts.md
logos.md
marketing-headers.md
marketing-navbars.md
notifications.md
onboarding.md
org-switcher.md
pricing.md
product-categories.md
product-grid.md
product-reviews.md
profiles.md
property-panels.md
settings.md
sharing.md
shopping-carts.md
sidebars.md
stats.md
store-signup-offers.md
teams.md
testimonials.md
webhooks.md
samples/
README.md
provider-setup.md
dark-mode.md
responsive-styles.md
theme-customization.md
component-recipes.md
chakra-factory.md
form-field-input.md
dialog.md
toast.md
table.md
scripts/
README.md
install.md
cli.md
generate.md
migration.md
test.md
mcp.mdtext
skills/chakra-ui/
SKILL.md
references/
get-started/
README.md
ai-llms.md
ai-mcp-server.md
ai-skills.md
changelog.md
cli.md
contributing.md
env-iframe.md
env-shadow-dom.md
figma.md
framework-next-app.md
framework-next-pages.md
framework-remix.md
framework-storybook.md
framework-tanstack-router.md
framework-vite.md
installation.md
migration.md
playground.md
components/
README.md
concepts/
layout/
typography/
buttons/
date-time/
forms/
collections/
overlays/
disclosure/
feedback/
data-display/
i18n/
utilities/
charts/
README.md
installation.md
area-chart.md
bar-chart.md
bar-list.md
bar-segment.md
axes.md
cartesian-grid.md
donut-chart.md
legend.md
line-chart.md
pie-chart.md
radar-chart.md
scatter-chart.md
sparkline.md
tooltip.md
use-chart.md
styling/
README.md
concepts/
compositions/
style-props/
theming/
README.md
concepts/
design-tokens/
compositions/
customization/
blocks/
README.md
ai.md
app-headers.md
app-integrations.md
app-navbars.md
authentication.md
banners.md
blogs.md
cards.md
careers.md
charts.md
contacts.md
cta.md
dividers.md
docs-changelog.md
docs-code-block.md
docs-example-preview.md
docs-header.md
docs-navbar.md
docs-pagination.md
docs-parameter-field.md
docs-sidebar.md
docs-step.md
docs-toc.md
faqs.md
features.md
feeds.md
footers.md
help-center.md
heroes.md
layouts.md
logos.md
marketing-headers.md
marketing-navbars.md
notifications.md
onboarding.md
org-switcher.md
pricing.md
product-categories.md
product-grid.md
product-reviews.md
profiles.md
property-panels.md
settings.md
sharing.md
shopping-carts.md
sidebars.md
stats.md
store-signup-offers.md
teams.md
testimonials.md
webhooks.md
samples/
README.md
provider-setup.md
dark-mode.md
responsive-styles.md
theme-customization.md
component-recipes.md
chakra-factory.md
form-field-input.md
dialog.md
toast.md
table.md
scripts/
README.md
install.md
cli.md
generate.md
migration.md
test.md
mcp.md探索手順
查阅步骤
タスクからカテゴリを引き、カテゴリの README.md で目的のページを特定する:
- 下記マッピング表でタスクに対応するカテゴリを探す
- そのカテゴリの を参照して目的のページを特定する
references/{category}/README.md - 該当ページの を Read して詳細を確認する
.md
根据任务匹配对应分类，通过分类下的README.md定位目标页面：
- 从下方映射表中查找任务对应的分类
- 查看该分类下的 以定位目标页面
references/{category}/README.md - 阅读对应页面的 文件查看详细内容
.md
タスク → カテゴリ マッピング
任务→分类映射表
| タスク | カテゴリ | 参照 README |
|---|---|---|
| インストール、フレームワーク統合（Next.js/Remix/Vite/TanStack Router）、AI 連携（LLMs.txt/MCP Server/AI Skills）、環境設定、CLI、移行 | get-started | references/get-started/README.md |
| コンポーネントの使い方、Props、バリアント、レイアウト、フォーム、オーバーレイ | components | references/components/README.md |
| チャートの表示、BarChart/LineChart/PieChart、useChart、データ可視化 | charts | references/charts/README.md |
| スタイルプロップ、レスポンシブデザイン、ダークモード、CSS 変数、Chakra Factory | styling | references/styling/README.md |
| デザイントークン、レシピ、スロットレシピ、カスタマイズ、defineConfig | theming | references/theming/README.md |
| UI ブロックテンプレート（ヒーロー、ナビバー、フッター等、要 CHAKRA_PRO_API_KEY） | blocks | references/blocks/README.md |
| 典型的な使い方（Provider 設定、ダークモード、フォーム、ダイアログ等） | samples | samples/README.md |
| インストール・CLI コマンド、コード生成、マイグレーション、テスト、MCP | scripts | scripts/README.md |
| 任务 | 分类 | 参考README |
|---|---|---|
| 安装、框架集成（Next.js/Remix/Vite/TanStack Router）、AI集成（LLMs/MCP Server/AI Skills）、环境配置、CLI、迁移 | get-started | references/get-started/README.md |
| 组件用法、Props、变体、布局、表单、浮层 | components | references/components/README.md |
| 图表展示、BarChart/LineChart/PieChart、useChart、数据可视化 | charts | references/charts/README.md |
| 样式属性、响应式设计、深色模式、CSS变量、Chakra Factory | styling | references/styling/README.md |
| 设计令牌、示例、插槽示例、自定义、defineConfig | theming | references/theming/README.md |
| UI模块模板（Hero、导航栏、页脚等，需CHAKRA_PRO_API_KEY） | blocks | references/blocks/README.md |
| 典型用法（Provider配置、深色模式、表单、对话框等） | samples | samples/README.md |
| 安装·CLI命令、代码生成、迁移、测试、MCP | scripts | scripts/README.md |