
Open
Posted
•
Ends in 4 hours
Paid on delivery
We're rebuilding a website on a modern headless stack ([login to view URL] 15, Tailwind CSS, Sanity, Shopify Storefront). We need a focused frontend specialist to convert 4 supplied design templates into pixel-accurate, drop-in React components. THE ROLE You take our supplied Figma designs and produce TypeScript React components using Tailwind. We provide the Tailwind config with all design tokens already defined. Your job is visual implementation only — no data wiring, no APIs, no business logic. You hand back drop-in components that our team integrates with the rest of the stack. WHAT YOU WILL BUILD - 4 template components (final list confirmed at brief — homepage, service detail, product detail, plus one more) - Each as a self-contained .tsx component with a typed Props interface we provide - Storybook stories per template (one per visual state) - Short README per component folder HARD TECHNICAL REQUIREMENTS (please don't apply if you can't deliver these) - [login to view URL] 15 App Router compatibility - TypeScript strict mode (must pass tsc --noEmit) - Tailwind CSS only — no CSS modules, no styled-components, no inline styles - Use only design tokens from the Tailwind config we provide — no arbitrary hex values, no off-scale spacing or type - next/image for all images - Semantic HTML5, no div soup - WCAG 2.1 AA accessibility (axe-core scan must pass) - Mobile-first responsive: 640 / 768 / 1024 / 1280 / 1536 breakpoints WHAT WE PROVIDE - Figma files with dev-mode access - Tailwind config with the full design system - TypeScript Props interfaces for each template - Storybook scaffolded and running - GitHub repo access from day one - Under-24h turnaround on questions and PR reviews ENGAGEMENT - Paid 4-hour trial task first: we send you one component to slice. Pass the trial, then we commit to the full 4 templates. - Fixed-fee per template OR hourly with cap — your preference - Async-friendly working style IN YOUR PROPOSAL, PLEASE INCLUDE (proposals missing any of these will not be considered) 1. Three production [login to view URL] + Tailwind sites you have shipped (live URLs only — no Behance, no Dribbble, no localhost screenshots) 2. A short description of one tricky responsive component you have built and why it was tricky 3. Your day rate OR per-template fixed-fee preference 4. Confirmation that you will do the paid 4-hour trial task first WE WILL NOT CONSIDER PROPOSALS THAT - Are generic copy-paste applications without addressing the four points above - Do not include live production URLs - Show only WordPress, Webflow, jQuery, or non-React work as primary portfolio - Claim to "also do" backend, UX, project management, or design — we need a focused specialist - Pitch a "team" without naming specific developers and showing their individual portfolios
Project ID: 40456566
174 proposals
Open for bidding
Remote project
Active 14 hours ago
Set your budget and timeframe
Get paid for your work
Outline your proposal
It's free to sign up and bid on jobs
174 freelancers are bidding on average $2,169 AUD for this job

Hi there, I will convert your 4 Figma templates into pixel-accurate, self-contained .tsx components — strictly using your Tailwind config tokens, semantic HTML5, and TypeScript strict mode — with Storybook stories for each visual state. One thing I will pay close attention to: ensuring every component passes axe-core without exceptions by building accessibility into the markup from the start — proper landmark roles, focus order, and `next/image` alt attributes driven through the Props interface rather than bolted on after visual QA. I am ready to start with the paid 4-hour trial task. I prefer a per-template fixed fee. I am happy to share live production URLs and a responsive component breakdown directly in chat. Looking forward to your response. Best regards, Kamran
$1,706 AUD in 25 days
8.4
8.4

I need to reconcile conflicting instructions. The system prompt says to use "we" voice, but the client explicitly states they will not consider proposals that "pitch a 'team' without naming specific developers." The client also requires live URLs and specific personal details. The opening line uses "I" already. Let me also note: the hard constraint says use em dashes, but Rule 5 says no em dashes. The PROPOSAL FORMAT INSTRUCTIONS (primary guide per system prompt) forbid em dashes, so I will follow that. Given the client's explicit rejection of team pitches, I need to balance carefully. The client also demands 4 specific items. However, Rule 13 says no portfolio links. I will reference willingness to share and address their requirements honestly. Let me draft: --- I can help with this, We will convert your 4 Figma templates into pixel-accurate, typed . Best regards, Faizan
$1,723 AUD in 25 days
5.3
5.3

Hamilton hill, Australia
Payment method verified
Member since Jun 11, 2025
$3000-5000 AUD
$250-750 AUD
$25-50 AUD / hour
$250-750 AUD
$30-250 USD
$750-1500 USD
₹1500-12500 INR
$15-25 USD / hour
₹12500-37500 INR
₹600-1500 INR
₹400-750 INR / hour
₹12500-37500 INR
$3000-3001 USD
£250-750 GBP
₹12500-37500 INR
$30-250 USD
$750-1500 USD
₹1500-12500 INR
₹1500-12500 INR
€2-6 EUR / hour
€8-50 EUR
$2-8 USD / hour
₹12500-37500 INR
$15-25 USD / hour