Staff Design Engineer

Cantos Ventures

San Francisco (CA)

Hybrid

USD 140,000 - 220,000

Full time

6 days ago
Be an early applicant
Application generator

Get a reply from this employer — a resume and cover letter tailored to exactly what they’re hiring for.

Get past ATS filters

Benefits offered by this job

Health insurance
401(k)
Daily catered lunch (SF office)
Commuter benefits
Home office stipend
Paid parental leave
Flexible paid time off

Job summary

Scribe is hiring a Staff Design Engineer who combines design elegance with frontend rigor. You will own Stylus, our design system, across web, desktop, extension, and marketing sites, and shape interactions with AI-ready design languages.

In this role you’ll prototype in React/TypeScript, validate concepts with users, and mentor engineers on design principles while driving system-wide improvements and accessibility. Hybrid work in SF is offered.

Qualifications

  • 8+ years of experience in front-end development with a strong design sensibility and deep knowledge of CSS, the DOM, and browser rendering.
  • You have design ability of your own and can decide how an interaction should feel.
  • You've worked on a design system at depth: components, primitives, tokens, versioning, adoption, and governance.
  • You shape the work rather than take tickets and are accountable for a roadmap.

Responsibilities

  • Own Stylus: roadmap, triage, and decisions based on adoption, accessibility, and documentation health.
  • Build hard components where aesthetics and performance clash; define shared primitives.
  • Prototype in React and TypeScript, validate with users and real customers.
  • Collaborate with designers with no handoff, iterating in Figma or code.
  • Keep design and code aligned; migrate legacy components to the system and improve tooling.
  • Develop AI-ready design patterns and primitives for UI assembled by models.
  • Document prompts, patterns, and workflows and mentor engineers on design principles.

Skills

Front-end development
Design sensibility
CSS
DOM & rendering
Design system
AI tooling (Cursor, Claude Code)
Accessibility
Roadmap ownership

Tools

React
TypeScript
Figma
Web components

Job description

tl;dr: We are looking for a Staff Design Engineer who thinks like a designer, codes like a front-end engineer, and treats AI as a collaborator.

About Scribe

Scribe is where exceptional people come to do the best work of their careers. More than 94% of the Fortune 500 use Scribe to own their specialized intelligence: the unique way their teams work, decide, and get things done. Our Specialized Intelligence platform automatically captures how work happens and turns it into a living asset that helps people and AI agents do their best work.

We're growing fast. Since our founding in 2019, we've grown to 7 million users across 600,000 businesses. Based in San Francisco, we've been named a LinkedIn Top Startup, are valued at over $1 billion, and are backed by leading investors. Join us in our mission to transform how people do work.

We're builders who hold a high bar, move fast, and care deeply about each other and our customers.

About the role

We're hiring a Staff Design Engineer to own Stylus, our design system, and the quality of what we ship across the web app, desktop app, browser extension, and marketing site. As a Staff Design Engineer at Scribe, you sit at the intersection of design and frontend engineering.

AI has made designs, code, and prototypes cheap to produce. What separates good product from great product now is judgment: knowing which interactions are worth building, and then building them well. We want someone who can look at a problem, decide what it should feel like, and ship it themselves.

At its core, this role is anchored in Stylus ownership. From there you'll drive both design craft (product polish, prototyping, and interaction quality) and platform power (frontend tooling, DevEx, and the internal agents and skills).

What you'll do
  • Own Stylus. The roadmap, triage, and the call on what goes in, measured against numbers we actually track: component adoption, accessibility coverage, and documentation health, plus the design system survey we run every 6–12 months. You'll set direction while absorbing requests from engineers and designers.

  • Build the hard components. The ones where aesthetics and performance fight each other. You'll decide what becomes a shared primitive and what stays a one-off, and build both.

  • Prototype in code and validate with customers. Build interactive prototypes in React and TypeScript for the explorations that are faster in code than in Figma: animation, keyboard, touch. Then test them with real users.

  • Work with designers without a handoff. A designer starts a direction, you iterate together in Figma or directly in code, and you're the person who can say what a given interaction will cost to build.

  • Keep design and code from drifting apart. Tokens aligned with design, legacy components actively migrated onto the system instead of left alone, and Figma-to-code tooling that stays useful.

  • Make the system work for agents as well as people. Explore emerging UX patterns and AI-ready design languages, and build the primitives we'll need as more of our UI gets assembled by models.

  • Share how you work. Document the prompts, patterns, and workflows you use in Cursor and Claude Code and share them with designers and engineers. Mentor engineers on design principles.

Your first 90 days

We hire people who set their own agenda, so treat this as the shape of the first quarter rather than a checklist handed to you.

Days 1–30 · Ship, then map.

  • Land your first Stylus change in the first week or two - small, real, in production. You'll learn more about our stack from one merged component fix than from a month of onboarding docs.

  • Build the honest picture: where components have drifted, which surfaces are furthest from the system, and what our accessibility coverage actually is versus what we assume it is.

  • Meet the people who file the requests - designers, product engineers, marketing - and watch customers use the product. Craft decisions get better when the person making them has watched someone struggle.

Days 31–60 · Set the line.

  • Publish the Stylus roadmap and the quality bar that goes with it, and start using both to say no. This is the point where a backlog becomes a plan with an owner.

  • Pick the first hard component and build it - the one where aesthetics and performance fight each other, that nobody has had the time to do properly.

  • Start the legacy migration where it pays off most, and make the path off legacy obvious enough that other engineers take it without being asked.

Days 61–90 · Make it hold without you.

  • Get adoption, accessibility, and documentation health reported automatically, so system health is a number we see rather than a question we ask.

  • Make contributing to Stylus something engineers and designers actually do: a clear way in for requests, contributions, and exceptions, with you making the call on each.

  • Ship the first AI workflows you'd want the rest of us using - the prompts, skills, and tooling that let designers and PMs build against the system safely.

By six months: Stylus has a real roadmap instead of a backlog, the legacy-component migration is actively moving, and adoption is reported automatically rather than asked about.

What we're looking for
  • 8+ years of experience in front-end development with a strong design sensibility and real depth in CSS, the DOM, and browser rendering. You have a view on when to use native platform elements versus a framework's version, and you can explain it.

  • Design ability of your own. You can make the call on an interaction, and you know which ones aren't worth what they cost to build.

  • You've worked on a design system at depth: components, primitives, tokens, versioning, adoption, and the governance to hold a line when a team wants an exception.

  • You shape the work rather than take tickets. You'll be accountable for a roadmap, which means knowing when to say no.

  • You already build with AI tools like Cursor and Claude Code, and you like getting other people using them well.

  • Accessibility, keyboard and touch input, and respecting user preferences are things you handle by default.

If you're reading this thinking "that's me!", we want to meet you.

Our loop is a code-and-craft exercise, not a portfolio review.

Nice to have
  • Figma plugins, automations, or CI checks that report design system adoption and accessibility

  • Web components or multi-framework experience, including shipping a system into non-React surfaces

  • Desktop apps or browser extensions, especially always-on ones

  • Agent-facing or generative UI work

Location

Hybrid: Based in San Francisco. We work from the office 3 days per week.

Compensation

Salary varies by location. All full-time employees receive equity in Scribe. Final offers depend on experience and scope.

Benefits
  • Health, dental, and vision insurance for you and your dependents

  • Flexible paid time off and company holidays

  • 401(k)

  • Paid parental leave

  • Daily catered lunch (SF office)

  • Commuter benefits

  • Home office stipend

At Scribe, we celebrate our differences and are committed to creating a workplace where all employees feel supported and empowered to do their best work. We believe this benefits not only our employees but our product, customers, and community as well. Scribe is proud to be an Equal Opportunity Employer.

Get your free, confidential resume review.
or drag and drop your file here.
Similar jobs

Similar jobs worth comparing

Staff Design Engineer
Staff Design Engineer

Scribe • San Francisco (CA)

On-site
USD 180,000 - 260,000
Health, dental, vision insurance
Flexible PTO
401(k)
+4
Senior Full-Stack Engineer, Core
Senior Full-Stack Engineer, Core

scribehow.com • San Francisco (CA)

Hybrid
USD 180,000 - 240,000
Health, dental, and vision insurance
Flexible paid time off
401(k)
+4
Senior Full-Stack Engineer, Agents
Senior Full-Stack Engineer, Agents

Cantos Ventures • San Francisco (CA)

Hybrid
USD 180,000 - 240,000
Health, dental, vision insurance
401(k)
Paid parental leave
+3
Senior Full-Stack Engineer, Agents
Senior Full-Stack Engineer, Agents

Mosaic.tech • San Francisco (CA)

Hybrid
USD 170,000 - 240,000
Health, dental, and vision insurance
Flexible paid time off and companyhol
401(k)
+4
Solutions Engineer
Solutions Engineer

Scribe • New York (NY), San Francisco (CA)

On-site
USD 180,000 - 225,000
Equity options
Health, dental, and vision insurance
Flexible paid time off
+2
AI Solutions Engineer
AI Solutions Engineer

scribehow.com • San Francisco (CA)

Hybrid
USD 180,000 - 225,000
Equity in company
Health, dental, and vision insurance
Flexible paid time off
+4
Staff Backend Engineer, Data Ingestion
Staff Backend Engineer, Data Ingestion

Scribe • United States

On-site
USD 180,000 - 240,000
Health, dental, and vision insurance
Flexible PTO
401(k)
+4
Solutions Engineer
Solutions Engineer

Cantos Ventures • San Francisco (CA)

Hybrid
USD 150,000 - 220,000
Health insurance
Equity in Scribe
Flexible paid time off
+3
Manager, Solutions Engineering
Manager, Solutions Engineering

Cantos Ventures • San Francisco (CA)

Hybrid
USD 260,000 - 300,000
Health insurance
Dental insurance
Vision insurance
+6
Sales Operations Manager, Enablement
Sales Operations Manager, Enablement

Mosaic.tech • San Francisco (CA)

Hybrid
USD 120,000 - 180,000
Health, dental, and vision insurance
401(k)
Paid parental leave
+3