Frontend Engineer - Design Systems

Posted 18 Hours Ago
Be an Early Applicant
Hiring Remotely in San Francisco, CA, USA
In-Office or Remote
141K-158K Annually
Entry level
Fintech
The Role
Build and evolve shared React and TypeScript components, patterns, and design tokens for Mercury’s design system. Partner with designers and product engineers to translate design intent into accessible, polished interfaces. Improve component quality, documentation, examples, workflows, and adoption across product teams. Use AI coding tools to prototype and implement solutions while evaluating generated code. The role offers ownership and mentorship for early-career and intermediate frontend engineers.
Summary Generated by Built In

Mercury's Design Systems team helps product teams build interfaces that feel consistent, accessible, and carefully considered. We're hiring a Frontend Engineer to help evolve the shared components and patterns behind those experiences, making it easier for teams across Mercury to turn good ideas into well-crafted software.

You'll work closely with designers and engineers to understand product needs, explore solutions, and carry improvements into the hands of the teams using them. This role is open to early-career and intermediate engineers. You'll build depth in frontend engineering and design systems through meaningful project ownership, with guidance from experienced teammates suited to your experience.

Design systems will be your initial focus within the team's broader Design Foundations work. As opportunities and interests align, you can also contribute to code-based prototyping and tools that help designers and AI agents work with Mercury's components. Strong AI fluency is part of how we build from the start.

As part of this role, you will:

  • Build shared components and patterns that make Mercury's interfaces better. You'll work in React and TypeScript, turning recurring product needs into flexible solutions that teams can use across different experiences.
  • Partner with designers and product engineers to connect design intent with working software. Help evolve components and tokens across Figma and code, using feedback from real product work to improve the system.
  • Improve the quality of the experiences built with our components. Consider how they look and behave for different users, bringing accessibility, thoughtful interactions, and reliable behavior into implementation and testing.
  • Make the design system easier to use. Help teams adopt shared patterns and improve the examples, documentation, and workflows that let people build confidently with them.
  • Use AI tools to explore approaches and move ideas into working code. Apply your judgment to what agents produce, test the results in context, and contribute useful approaches back to the team.

What you'll bring:

We're interested in what you've built and how you think. Your experience may come from professional work, internships, coursework, open source, or personal projects.

  • A foundation in React, TypeScript, HTML, and CSS, with experience building interfaces and the ability to explain the decisions behind your code.
  • Care for visual craft and how people use software, including an interest in accessible interfaces and the details that make interactions feel right.
  • Hands-on fluency with AI coding tools. You can provide useful context, evaluate and improve generated code, and verify that it works as intended.
  • Ownership and a willingness to learn: you follow work through, communicate when you need help, and use feedback to improve your approach.
  • Curiosity about reusable systems and the tradeoffs involved in serving different product needs with shared components.
  • An interest in solving problems alongside designers and engineers, contributing ideas, and understanding the needs behind a request.
  • Experience with design systems, prototyping, or developer tooling is a plus. You don't need to have held a design systems role to bring useful skills and ideas to this team.

If this role interests you, we invite you to explore our public demo at demo.mercury.com. 

*Mercury is a fintech company, not an FDIC-insured bank. Banking services provided through Choice Financial Group and Column N.A., Members FDIC.

Mercury values diversity & belonging and is proud to be an Equal Employment Opportunity employer. All individuals seeking employment at Mercury are considered without regard to race, color, religion, national origin, age, sex, marital status, ancestry, physical or mental disability, veteran status, gender identity, sexual orientation, or any other legally protected characteristic. We are committed to providing reasonable accommodations throughout the recruitment process for applicants with disabilities or special needs. If you need assistance, or an accommodation, please let your recruiter know once you are contacted about a role.

#LI-MC1

Total Rewards
The total rewards package at Mercury includes base salary, equity (stock options/RSUs), and benefits.

Our salary and equity ranges are highly competitive within the SaaS and fintech industry and are updated regularly using the most reliable compensation survey data for our industry. New hire offers are made based on a candidate’s experience, expertise, geographic location, and internal pay equity relative to peers.

Our target new hire base salary ranges for this role are the following:

US employees (any location):
$140,800—$158,400 USD
Canadian employees (any location):
$115,700—$149,700 CAD

Skills Required

  • Foundation in React, TypeScript, HTML, and CSS
  • Experience building user interfaces and ability to explain implementation decisions
  • Interest in visual craft, accessible interfaces, and thoughtful interaction design
  • Hands-on fluency with AI coding tools, including providing context, evaluating generated code, improving it, and verifying results
  • Ownership, willingness to learn, communication, and ability to use feedback to improve
  • Curiosity about reusable systems and tradeoffs in shared components
  • Interest in collaborating with designers and engineers and understanding user needs
  • Experience with design systems, prototyping, or developer tooling

Mercury Compensation & Benefits Highlights

The following summarizes recurring compensation and benefits themes identified from responses generated by popular LLMs to common candidate questions about Mercury and has not been reviewed or approved by Mercury.

  • Healthcare Strength — Healthcare coverage is described as comprehensive for employees and dependents, with HSA access and mental health support. Feedback suggests this breadth is a strong pillar of the package.
  • Retirement Support — Retirement matching begins on day one and is cited at up to 4% of base salary. This early eligibility and match level are positioned as competitive features.
  • Parental & Family Support — Paid parental leave is presented as generous, with up to 16 weeks for birthing parents and 12 weeks for non-birthing parents, plus family-forming benefits through Carrot Fertility. These policies indicate a family-friendly approach that stands out for a startup.

Mercury Insights

Am I A Good Fit?
beta
Get Personalized Job Insights.
Our AI-powered fit analysis compares your resume with a job listing so you know if your skills & experience align.

The Company
HQ: San Francisco, CA
150 Employees
Year Founded: 2017

What We Do

Mercury is building banking for startups. We want to power the next generation of companies that will shape American industry.

Similar Jobs

Tapestry - Coach and Kate Spade Logo Tapestry - Coach and Kate Spade

Retail Contingent

eCommerce • Fashion • Retail • Sales • Wearables • Design
Remote or Hybrid
14 Locations
16000 Employees
15-20 Hourly

Pfizer Logo Pfizer

Dedicated Care Coordinator North Central

Artificial Intelligence • Healthtech • Machine Learning • Natural Language Processing • Biotech • Pharmaceutical
Remote
2 Locations
121990 Employees
163K-272K Annually

Jellyfish Logo Jellyfish

Head of Corporate Marketing

Big Data • Cloud • Productivity • Software • Database • Analytics • Automation
Remote or Hybrid
United States
225 Employees
250K-305K Annually

Wipfli Logo Wipfli

Architect

Cloud • Fintech • Software • Business Intelligence • Consulting • Financial Services
Remote or Hybrid
United States
2900 Employees
129K-174K Annually

Similar Companies Hiring

Hanover Park Thumbnail
Artificial Intelligence • Fintech • Software • Financial Services
New York, New York
42 Employees
Kepler  Thumbnail
Artificial Intelligence • Fintech • Software
New York, New York
9 Employees
Onshore Thumbnail
Artificial Intelligence • Fintech • Software • Financial Services
New York, New York
60 Employees

Sign up now Access later

Create Free Account

Please log in or sign up to report this job.

Create Free Account