Front-End Engineer – Design System Implementation
The Elite Job
A complete application in a minute
Tailored resume and cover letter, ready to send.
Benefits offered by this job
Job summary
The Elite Job is seeking a skilled Front-End Engineer specializing in Design System Implementation to create scalable UI components, maintain design tokens, and ensure accessibility across web applications. You will work with UI/UX designers, product managers, and back-end engineers to deliver consistent design systems and high-quality front-end solutions.
You will build reusable components, maintain design tokens, optimize performance, and contribute to documentation and development workflow
Qualifications
- Proficient in HTML5, CSS3, and modern JavaScript with TypeScript.
- Experience with React, Angular, or Vue.js and component-driven development.
- Experience building design systems, reusable UI components, and tokens.
Responsibilities
- Develop, maintain, and enhance reusable front-end components aligned with design guidelines.
- Translate designs into responsive, accessible interfaces across platforms.
- Collaborate with design, product, and back-end teams to implement design system standards.
- Write tests, ensure performance, and maintain documentation for components.
Skills
Education
Tools
Job description
The Elite Job is seeking a skilled and detail-oriented Front-End Engineer – Design System Implementation to develop, maintain, and enhance scalable, reusable, and accessible user interface components for modern web applications. This role is ideal for a front-end professional who combines strong programming skills with an understanding of user experience, visual consistency, responsive design, and component-based development.
The successful candidate will work closely with UI/UX designers, product managers, back-end engineers, and quality assurance teams to translate design concepts into reliable, high-quality front-end solutions. The primary responsibility will be implementing and maintaining a design system that enables development teams to create consistent digital experiences across multiple products and platforms.
The role involves building reusable UI components, maintaining design tokens, implementing responsive layouts, improving accessibility, and ensuring that front-end applications follow established design standards. The candidate will also contribute to documentation, component testing, performance optimization, and continuous improvements to the development workflow.
At The Elite Job, we value technical excellence, collaboration, creativity, and continuous learning. We welcome candidates who enjoy solving complex front-end challenges and building user interfaces that are visually consistent, maintainable, and easy to use.
- Develop, maintain, and enhance reusable front-end components aligned with established design guidelines.
- Translate UI/UX designs, wireframes, and prototypes into functional, responsive, and visually accurate interfaces.
- Implement and maintain design tokens for colors, typography, spacing, borders, shadows, and other interface properties.
- Establish consistent component patterns that can be reused across multiple applications and development teams.
- Ensure that all implemented components follow the approved design system standards.
- Build responsive web interfaces using HTML5, CSS3, JavaScript, TypeScript, and modern front-end frameworks.
- Develop reusable components such as buttons, forms, navigation menus, modals, dropdowns, tables, cards, and interactive elements.
- Integrate front-end components with APIs and back-end services.
- Maintain clean, modular, readable, and well-organized code.
- Implement interactive features while ensuring a consistent user experience across supported browsers and devices.
- Work closely with UI/UX designers to understand design specifications, interaction patterns, and visual requirements.
- Collaborate with product managers to translate business requirements into practical front-end solutions.
- Participate in design reviews, technical discussions, sprint planning, and development meetings.
- Provide technical feedback on component feasibility, usability, accessibility, and maintainability.
- Help establish effective communication between design and engineering teams.
- Implement accessible user interfaces following recognized accessibility practices, including relevant WCAG guidelines.
- Ensure keyboard navigation, appropriate focus management, semantic HTML, and screen-reader compatibility.
- Create responsive layouts that work effectively across desktop computers, tablets, and mobile devices.
- Test components for usability, visual consistency, and accessibility issues.
- Identify and resolve interface inconsistencies across different browsers and screen sizes.
- Write unit tests and component tests to verify functionality and reliability.
- Use appropriate testing tools to validate component behavior and identify defects.
- Collaborate with QA engineers to resolve visual, functional, and cross-browser issues.
- Review code submitted by team members and follow established coding standards.
- Monitor component performance and resolve rendering issues, unnecessary re-renders, and other front-end bottlenecks.
- Maintain backward compatibility and manage component updates carefully to minimize disruption to existing applications.
- Create and maintain technical documentation for reusable components, usage guidelines, and implementation patterns.
- Maintain component examples and interactive documentation using tools such as Storybook or equivalent platforms.
- Document component properties, supported variants, states, and accessibility requirements.
- Identify opportunities to improve development efficiency through automation and standardization.
- Stay informed about modern front-end technologies, design system practices, and emerging development tools.
Bachelors degree in Computer Science, Information Technology, Software Engineering, or a related discipline is preferred.
Equivalent professional experience, practical development skills, or relevant technical certifications may also be considered.
Candidates should demonstrate a strong understanding of front-end development principles and modern web technologies.
- Strong knowledge of HTML5, CSS3, and modern JavaScript.
- Proficiency in TypeScript and component-based development.
- Experience with at least one modern front-end framework, such as React, Angular, or Vue.js.
- Understanding of component architecture, reusable UI patterns, and state management.
- Experience with CSS methodologies, responsive layouts, and design tokens.
- Familiarity with CSS frameworks or component libraries such as Tailwind CSS, Sass, Material UI, or equivalent technologies.
- Knowledge of REST APIs, JSON, asynchronous programming, and front-end integration.
- Familiarity with Git and collaborative version control workflows.
- Understanding of front-end testing frameworks and browser developer tools.
- Knowledge of web performance optimization, browser compatibility, and accessibility standards.
- Ability to interpret Figma files, design specifications, prototypes, and visual references.
- Understanding of typography, spacing systems, color consistency, visual hierarchy, and interaction states.
- Ability to identify and correct differences between approved designs and implemented interfaces.
- Awareness of usability principles and inclusive design practices.
- Ability to balance visual accuracy with technical performance and maintainability.
Candidates with approximately 2–5 years of front-end development experience are preferred.
Practical experience building reusable components and responsive web applications is highly desirable.
Experience implementing or maintaining a design system, component library, or shared UI framework is an advantage.
Previous collaboration with product designers, UX researchers, back-end developers, and QA teams is beneficial.
Experience using Storybook, Figma, automated testing tools, and component documentation platforms is preferred.
Familiarity with CI/CD pipelines, build tools, package managers, and modern development workflows is an added advantage.
Candidates with less experience may also be considered if they demonstrate strong technical fundamentals, a relevant project portfolio, and the ability to learn quickly.
Employment Type: Full-time.
Working Schedule: Standard business hours, subject to the organizations operational requirements.
Work Arrangement: Remote, hybrid, or office-based, depending on the position and company requirements.
Weekly Schedule: Typically five working days per week.
Flexibility: Reasonable flexibility may be available to support collaboration across teams and time zones.
Meetings: Participation in sprint planning, design reviews, technical discussions, and team coordination sessions may be required.
Additional Hours: Occasional additional hours may be necessary during major releases or critical project deadlines.
The final work schedule, time zone requirements, and remote-work arrangements will be communicated during the recruitment process.
Strong understanding of the browser rendering process, DOM manipulation, CSS layout systems, and JavaScript execution.
Knowledge of component-driven architecture and scalable front-end application structures.
Understanding of design tokens, component variants, theming, and visual consistency.
Familiarity with accessibility testing, responsive design, and cross-browser compatibility.
Ability to troubleshoot complex UI issues and optimize application performance.
Ability to break complex design requirements into manageable development tasks.
Strong analytical skills for identifying inconsistencies, debugging errors, and evaluating alternative solutions.
Ability to determine whether a component should be reused, extended, or developed as a new component.
Willingness to investigate technical challenges and recommend practical improvements.
Strong written and verbal communication skills.
Ability to explain technical concepts to designers, developers, and non-technical stakeholders.
Ability to work effectively in cross-functional teams.
Openness to code reviews, constructive feedback, and collaborative problem-solving.
Ability to manage priorities and deliver high-quality work within agreed timelines.
Attention to detail when implementing designs and testing interface behavior.
Commitment to clean code, accurate documentation, and established engineering standards.
Ability to adapt to changing project requirements and evolving technologies.
A proactive approach to learning, experimentation, and continuous improvement.
- Competitive compensation based on skills, experience, and role responsibilities.
- Opportunities to work on modern web applications and scalable design system projects.
- Professional development through technical training, workshops, and learning resources.
- Opportunities to strengthen expertise in React, TypeScript, accessibility, and component architecture.
- Collaborative working relationships with experienced engineering, design, and product professionals.
- Flexible work arrangements where supported by the position.
- Opportunities to contribute ideas and influence front-end development standards.
- Recognition for quality work, innovation, and meaningful project contributions.
- Career development opportunities within front-end engineering and related technical disciplines.
- Paid leave and other applicable employment benefits in accordance with company policy and local regulations.
- Specific benefits, eligibility requirements, and compensation details will be shared during the hiring process.
Joining The Elite Job offers an opportunity to contribute to modern front-end development practices while building technical expertise in design system implementation. This position is suitable for professionals who enjoy creating reusable components, improving user experiences, and establishing consistent design standards across digital products.
- Build Reusable Solutions: Work on component libraries and shared UI patterns that help development teams build applications more efficiently.
- Collaborate Across Disciplines: Partner with designers, product managers, and engineers to transform creative concepts into functional digital experiences.
- Strengthen Your Technical Expertise: Develop practical knowledge of modern JavaScript frameworks, TypeScript, testing, accessibility, and performance optimization.
- Make a Meaningful Contribution: Help improve the consistency, usability, and maintainability of front-end applications through thoughtful engineering decisions.
- Grow Professionally: Expand your capabilities through challenging assignments, collaborative feedback, and ongoing learning opportunities.
- Support Quality and Innovation: Contribute to a culture that values maintainable code, clear documentation, technical responsibility, and continuous improvement.
- At The Elite Job, we seek professionals who are passionate about building reliable digital products and understand the importance of connecting excellent design with excellent engineering.
'/%3e%3cpath%20d='M101.744%2012.4726L102.894%2016.1947L99.0021%2013.2201L101.744%2012.4726ZM105.3%208.40937H100.488L99.0026%203.59473L97.5116%208.41047L92.7%208.40385L96.5965%2011.3834L95.1055%2016.1942L99.0021%2013.2196L101.408%2011.3834L105.3%208.40992V8.40937Z'%20fill='white'/%3e%3cdefs%3e%3clinearGradient%20id='paint0_linear_5593_1381'%20x1='90'%20y1='9.44471'%20x2='99'%20y2='9.44471'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%2300AD70'/%3e%3cstop%20offset='0.998594'%20stop-color='%2300B67A'/%3e%3cstop%20offset='1'%20stop-color='%23DCDCE6'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e){kind=small}
