Tailwind CSS Developer for Figma Conversion

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

We are looking for an experienced Front-End Developer to convert a responsive Figma website design into static, high-performance HTML built with Tailwind CSS, prepared for integration into WordPress using Gutenberg and ACF Pro. All page sections, excluding the header and footer, must be developed as static custom Gutenberg blocks. The header and footer are in scope, but they will be built as static site components, not Gutenberg blocks. This role is front-end only. No WordPress backend logic or PHP development is required. --- ### Scope of Work Convert Figma designs into pixel-accurate, responsive HTML Use Tailwind CSS as the styling framework Create a shared Tailwind configuration including: Grid and layout system Typography scale Color palette Spacing tokens and breakpoints Build the site header and footer as static, reusable components Develop static custom Gutenberg blocks for: All page sections and content components Maintain clear separation between: Global components (header, footer) Block-level components (page sections) --- ### Technical Requirements #### HTML Semantic HTML5 Clean, maintainable markup SEO-ready structure: Proper heading hierarchy Landmarks and semantic regions Accessibility-aware structure (ARIA where applicable) #### Tailwind CSS Tailwind CSS (latest stable version) Configuration-driven design system: Custom theme values for colors, fonts, spacing, breakpoints Consistent utility usage across blocks and global components Minimal custom CSS outside Tailwind Production-ready and purge-safe structure #### JavaScript Vanilla JavaScript only JS used only when required Scoped per component or block Optimized for performance and clean execution --- ### Gutenberg / WordPress Integration Readiness Page sections must be built as static custom Gutenberg blocks Markup must be compatible with ACF Pro field-based rendering No dependency on editor-side JS frameworks Predictable and reusable markup per block --- ### Performance & Optimization Optimized for fast load times and high Lighthouse scores Minimal DOM complexity Efficient asset usage Mobile-first implementation --- ### Responsiveness Fully responsive across mobile, tablet, and desktop Behavior and breakpoints must match Figma designs precisely --- ### Deliverables Static HTML for: Header and footer (global components) All custom Gutenberg blocks (page sections) Tailwind configuration file Organized folder and file structure JavaScript files where required Integration notes for WordPress and ACF Pro --- ### Out of Scope PHP or backend logic WordPress theme development Page builders CSS frameworks other than Tailwind --- ### Ideal Candidate Strong experience converting Figma designs to Tailwind-based HTML Experience preparing front-end output for Gutenberg and ACF Pro Performance-focused and detail-oriented Comfortable working with modular, component-based architecture --- ### When Applying, Please Include Relevant Tailwind and Gutenberg-related work samples Confirmation that you understand: Header and footer are static components All other sections are Gutenberg blocks Estimated timeline and availability