ライブプレビュー、プロンプトが運ぶのと全く同じコードで動作しています
Teller Monthly Budget Pace
A monthly budget screen built around a pace chart: cumulative spend walked out of a daily array as a solid line, the even pace to the budget as a neutral dashed line, and the same rate carried past today as a dashed projection landing well over. Category budgets follow as proportional bars, with only the ones heading past their own limit taking the red.
Claude Code、Cursor、Windsurfに貼り付けてください。この画面をあなたのアプリに1対1で構築します。
プロンプトに含まれるものすべてインライン、外部取得なし
- screen.tsx
- 完全な形で記述済み、貼り付けるだけ
- 506行
- Inter
- Regular, Medium, Semi Bold, Bold, Extra Bold
- @expo-google-fonts 経由
- 統合ルール
- 1:1で再現され、既存テーマに合わせて変更されません
- SDK 52+
このデザインが従うルール
プレビューと全く同じ状態で提供されます：同じ色、同じタイポグラフィ、同じテキスト、同じモーション。プロンプトはあなたのエージェントに、既存のテーマに合わせて調整せず、そのまま構築するよう指示します。
