Skip to content
View marklearst's full-sized avatar
🫥
👨🏻‍💻 Coder to the core. 🎨 Think like a designer.
🫥
👨🏻‍💻 Coder to the core. 🎨 Think like a designer.

Block or report marklearst

Report abuse

Contact GitHub support about this user’s behavior. Learn more about reporting abuse.

Report abuse
marklearst/README.md
~/github/marklearst on main ✓
❯ whoami
name: Mark Learst
role: Senior Design Engineer
focus: Design Systems, DX Tooling, React, TypeScript, Agentic Workflows, OSS
tagline: Coder to the core, think like a designer.
❯ cat about.md
Senior Design Engineer who builds accessible design systems and React
component libraries that teams actually want to use.

At GM, I helped architect Aurora across 4 brands, drove meaningful
component reuse, and supported WCAG 2.2 AA compliance. I also trained
50 plus engineers and designers on the system.

I ship open source tools with real adoption:
• a11y Companion, Figma widget for practical accessibility checks
• FigmaVars Hooks, React hooks for working with Figma Variables exports
• Diabetic Utils, TypeScript utilities for glucose and A1C related calculations
• Variable Design Standard, spec driven token governance work

I build the glue between Figma and production: tight APIs, automated
pipelines, drift resistant systems that hold up long after launch.
❯ cat stack.json
{
  "ui": ["React 19", "TypeScript", "Next.js", "TanStack", "Tailwind"],
  "systems": ["Storybook", "Figma Variables", "Design Tokens", "MDX"],
  "ai": ["Claude Code", "Cursor", "Agentic Workflows", "Subagents", "MCP"],
  "quality": ["WCAG 2.2 AA", "Playwright", "Vitest", "CI Gates"],
  "standards": ["DTCG", "VDS", "Semantic Versioning"]
}
❯ cat ai-workflow.md
I develop with agentic workflows: Claude Code for architecture and
validation, Cursor for implementation. Subagent orchestration,
CLAUDE.md guardrails, MCP servers for context.

I have shipped portfolio work, component libraries, and OSS tooling
using this stack. The future is hybrid.
❯ cat oss.json
{
  "a11y companion": "Figma widget, 200 plus users, practical WCAG focused guidance",
  "figmavars hooks": "React 19 hooks, Figma Variables workflows, strong test coverage",
  "diabetic utils": "TypeScript, glucose and A1C analytics utilities",
  "variable design standard": "Token governance spec work, DTCG aligned"
}
❯ cat status.txt
🟢 Open to remote full time roles
   Design Systems, DX Tooling, Staff level IC

   React, TypeScript, Next.js, Storybook, Design Tokens
   Figma, WCAG, Claude Code, Cursor, Agentic Workflows
❯ cat links.md
- Portfolio: https://www.marklearst.com
- LinkedIn: https://linkedin.com/in/marklearst
- VDS Spec: https://variable-design-standard.vercel.app

Pinned Loading

  1. a11y-companion-widget a11y-companion-widget Public

    ♿️ a11y Companion Widget, Open-source Figma widget for running the A11Y Project checklist with WCAG references, search, theme presets, bulk actions, and progress export.

    TypeScript 1

  2. variable-design-standard variable-design-standard Public

    A public, tool-agnostic spec and governance rules for design variables: schema, contract, naming, modes, references, and change control.

    CSS 1

  3. figma-vars-hooks figma-vars-hooks Public

    🌳 Welcome to FigmaVars, a React hooks library designed to simplify the integration of Figma variables into your React applications.

    TypeScript 3

  4. diabetic-utils diabetic-utils Public

    🩸 A modern TypeScript utility library for glucose, A1C, and diabetic health data.

    TypeScript 4

  5. hailstorm hailstorm Public

    Forked from abusix/hailstorm

    Hailstorm - Abusix Design System. [Team: guardian]

    TypeScript