CozyPaws

网站 · Hero · 免费

在云境TS 中打开并复制 →

内容预览

## Prompt to Recreate CozyPaws Hero Section **Build a single-page "CozyPaws" pet store hero section using React, Tailwind CSS, and Lucide React icons. The layout is viewport-height (h-screen), no scroll, with three responsive breakpoints (mobile, tablet md, desktop lg+). Use Vite + TypeScript.** --- ### Fonts (Google Fonts) - **Inter** (weights: 400, 500, 600) — body/UI text - **DM Serif Display** (weight: 400) — hero heading only Load via `` in `index.html`: ``` https://fonts.googleapis.com/css2?family=DM+Serif+Display&family=Inter:wght@400;500;600&display=swap ``` Apply with CSS utility class `.font-serif-display { font-family: 'DM Serif Display', serif; }` and `body { font-family: 'Inter', sans-serif; }` --- ### Color Palette - Background: `#EFFDF0` (light mint green) - Primary dark green: `#1a3d1a` - Hover green: `#2a5a2a` - Orange accent: `#E86A10` - Orange hover: `#d45e0d` --- ### Asset URLs (all external, do not download) | Asset | URL | |-------|-----| | Logo SVG | `https://polo-pecan-73837341.figma.site/_assets/v11/0ae29d6d9628bede667f90d57bebe81b8f1ec2bf.svg` | | Avatar | `https://polo-pecan-73837341.figma.site/_assets/v11/e62173d41f91350a59628e8a9a55ae078a886fb9.png?w=128` | | Product card (Cat House) | `https://polo-pecan-73837341.figma.site/_assets/v11/3e5158dad63d392ade022e81890edc9f54d750bc.png` | | Video card (TikTok/YouTube) | `https://polo-pecan-73837341.figma.site/_assets/v11/76be6ec3a93a703b15e9cc01e764a4e3f9d7d2c0.png` | | Bottom left image | `https://pol

……(完整源码请在站内查看)