Kiln
Designüberblick
Kiln ist die Website einer quelloffenen Komponentenbibliothek für React-Entwickler und zeigt mehr als 40 Komponenten – darunter Schaltflächen, Eingaben, Tabellen und Datumsauswahlen – als funktionierende Komponentenwand. Eine kühlweiße Werkbank, Umbra-Glasur und geprägte Stirnflächen bilden ein präzises, zurückhaltendes Raster.
Prompt
Produkt: Kiln, eine quelloffene Komponentenbibliothek für React-Entwickler mit mehr als 40 Komponenten, darunter Schaltflächen, Eingaben, Dropdowns, Befehlspaletten, Dialoge, Tooltips, Tabellen und Datumsauswahlen. Sie unterstützt individuelle Themes.
Erstelle ihre Website-Startseite, optional mit einer Komponentendetailseite:
- Zeige echte interaktive Komponenten direkt auf der Startseite statt Screenshots. Eine „Komponentenwand“ soll funktionierende Komponenten enthalten, die Nutzer anklicken, mit Text füllen und umschalten können.
- Orientiere dich an der Präzision und Zurückhaltung führender Entwicklertool-Websites: überwiegend Schwarz und Weiß, höchstens eine Akzentfarbe, ein strenges Raster und Monospace-Schrift für Code und Zahlen.
- Mach einen Theme-Controller einprägsam: Das Ziehen von Radius-, Dichte- oder Akzentfarbreglern verändert sofort jede Komponente auf der Seite.
- Füge einen kopierbaren Installationsbefehl, Codeausschnitte, Navigation nach Komponentenkategorie und realistische Nutzungszahlen wie GitHub-Sterne und wöchentliche Downloads hinzu, ohne übermäßig runde Zahlen.
Chinesischen Originalprompt ansehen
产品：「Kiln」，一个给 React 开发者用的开源组件库：按钮、输入框、下拉、命令面板、弹窗、提示、表格、日期选择等 40 多个组件，支持主题定制。
做它的官网首页（可以加一个组件详情页）：
- 首页要直接展示真实可交互的组件，而不是截图：一块“组件墙”里放着能点、能输入、能切换的真组件。
- 气质参考一线开发者工具官网的精确与克制：黑白为主，最多一种强调色，严格的网格，等宽字体用在代码和数字上。
- 记忆点：一个主题调节器，拖动圆角、密度或强调色，整页所有组件当场一起变化。
- 要有：安装命令（可复制）、代码片段、组件分类导航、一段真实的使用数据（例如 GitHub 星数、周下载量，数字不整齐）。
