Pixel-Perfect Figma Next.js Conversion

Замовник: AI | Опубліковано: 30.12.2025
Бюджет: 750 $

I have a multi-page Figma file, complete with layer comps, break-points, and a separate sheet that documents every animation in detail. Your task is to reproduce each screen in Next.js exactly as it appears, using Tailwind CSS for styling. I expect a true 1:1 match—no creative tweaks, AI-generated edits, or “close enough” approximations. Every pixel, timing curve, and easing function already lives in the design; you simply need to translate it faithfully. Interactivity sits at a moderate level: click- and hover-driven state changes, toggles, and subtle micro-animations. The specs outline when components appear, shift, or fade, so you will have clear direction and won’t be guessing. You’re free to lean on Framer Motion, React Spring, or straight CSS keyframes—whatever keeps the bundle light and reproduces the exact feel. I break compensation down by page complexity: $30 for each full-length or highly animated page, and $15–$20 for smaller sections or modal-only layouts. Before we start, we’ll review the Figma link together to classify pages so the pricing is transparent. Acceptance criteria: • Pixel-perfect layout across provided breakpoints • Tailwind utility classes only—no inline styles or external frameworks • Animations reproduced exactly to the timing specs • Components compile cleanly in a fresh Next.js install (no missing deps) • Final push delivered as a Git repo or ZIP, ready to yarn install && next build with no errors If that scope fits your skill set and you’re confident in matching Figma down to the sub-pixel, let’s get started.