21st-ui-explore

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Chinese

Create real choices without abandoning the project's visual identity.

无需脱离项目视觉标识，创建切实可行的选择方案。

Read
```
.21st/design.json
```
and the relevant product UI. If context is missing, run
```
21st init --design-context
```
.
Search 21st for multiple relevant references before generating:
bash
```
21st search "<interface and product context>" --context auto
```
Define three named directions. Each direction must differ on at least two meaningful axes such as hierarchy, information density, navigation model, content emphasis, interaction pattern, or composition. Color-only variants do not count.
Keep shared constraints fixed: real stack, tokens, brand assets, required content, accessibility, and responsive behavior.

Generate or implement comparable previews. Prefer:

bash

21st generate "<goal plus fixed constraints>" --context auto --variants 3

Present the options together when the host supports a picker. Otherwise give each option a preview/deep link and a compact comparison.
Recommend one direction with concrete tradeoffs, but let the user choose.
After selection, remove abandoned local variants and record the decision in
```
.21st/design.json
```
.

读取
```
.21st/design.json
```
和相关产品UI。若缺少上下文信息，请运行
```
21st init --design-context
```
。
在生成内容前，在21st中搜索多个相关参考资料：
bash
```
21st search "<interface and product context>" --context auto
```
定义三个带有名称的方向。每个方向必须在至少两个关键维度上存在差异，例如层级结构、信息密度、导航模式、内容侧重点、交互模式或布局方式。仅颜色变体不符合要求。
固定共享约束条件：实际技术栈、设计令牌、品牌资产、必填内容、无障碍设计和响应式表现。

生成或实现可对比的预览。优先使用：

bash

21st generate "<goal plus fixed constraints>" --context auto --variants 3

For every direction provide:

Do not generate random style mutations. Every difference must support a product or usability hypothesis that a user can evaluate.

每个方向需包含：

请勿生成随机样式变更。每一处差异都需支撑用户可评估的产品或可用性假设。