Prompt file imported from yihui315/tianji-global (.codex/prompts/design-rules.md). Copyright stays with the author.

Tianji Design Rules

Name: design-rules
Author: yihui315

Use this prompt context for celestial-ui-implementer, relationship-flow-builder, share-card-og-builder, and visual QA tasks.

Visual Direction

Premium celestial romance, not generic astrology stock.
Deep navy, black plum, antique gold, rose amber, and restrained luminous accents.
Use real Tianji product states, report surfaces, relationship flows, or generated brand assets where visual inspection matters.
Avoid one-off decorative layouts when a reusable component is appropriate.

Expected Components

StarField
DestinyThread
MysticCard
CompassSeal
BirthChartInput
RelationshipOrbit
RitualCTA
CosmicFooter

Required States

Each reusable visual component should consider:

Desktop layout
Mobile layout
Loading state
Empty state
Error state
Reduced-motion mode
Accessible labels or names for interactive controls

UI Constraints

Keep primary CTA visible early on mobile.
Preserve pricing, FAQ, trust, disclaimer, and premium upgrade paths.
Do not let text overflow or overlap on mobile or desktop.
Do not add dependencies without explicit approval.
For visual PRs, include screenshots or browser QA notes in the review packet.

{ "prompt": "# Tianji Design Rules\n\nUse this prompt context for `celestial-ui-implementer`, `relationship-flow-builder`, `share-card-og-builder`, and visual QA tasks.\n\n## Visual Direction\n\n- Premium celestial romance, not generic astrology stock.\n- Deep navy, black plum, antique gold, rose amber, and restrained luminous accents.\n- Use real Tianji product states, report surfaces, relationship flows, or generated brand assets where visual inspection matters.\n- Avoid one-off decorative layouts when a reusable component is appropriate.\n\n## Expected Components\n\n- `StarField`\n- `DestinyThread`\n- `MysticCard`\n- `CompassSeal`\n- `BirthChartInput`\n- `RelationshipOrbit`\n- `RitualCTA`\n- `CosmicFooter`\n\n## Required States\n\nEach reusable visual component should consider:\n\n- Desktop layout\n- Mobile layout\n- Loading state\n- Empty state\n- Error state\n- Reduced-motion mode\n- Accessible labels or names for interactive controls\n\n## UI Constraints\n\n- Keep primary CTA visible early on mobile.\n- Preserve pricing, FAQ, trust, disclaimer, and premium upgrade paths.\n- Do not let text overflow or overlap on mobile or desktop.\n- Do not add dependencies without explicit approval.\n- For visual PRs, include screenshots or browser QA notes in the review packet.", "variables": [], "notes": "Use this prompt context for `celestial-ui-implementer`, `relationship-flow-builder`, `share-card-og-builder`, and visual QA tasks.", "metadata": { "source": { "provider": "github-codex-prompts", "repository": "https://github.com/yihui315/tianji-global", "path": ".codex/prompts/design-rules.md", "ref": "941c82f8eb16c21076b9c53484984bcf540d5b16", "url": "https://github.com/yihui315/tianji-global/blob/941c82f8eb16c21076b9c53484984bcf540d5b16/.codex/prompts/design-rules.md", "key": "yihui315/tianji-global/.codex/prompts/design-rules.md" } } }

design-rules

About

Tianji Design Rules

Visual Direction

Expected Components

Required States

UI Constraints

Use it

Manifest

Reviews