Integrations

Connect your
entire workflow.

Originmain integrates with GitHub, Figma, Linear, Slack, VS Code, Cursor, TypeScript, and React โ€” so every part of your design-to-code pipeline is connected, without changing how you work.

GitHub
PR reviews trigger automatic diffs. Every merge computes a full component-level diff.
Live
Figma
Design tokens, components & layouts synced live into the graph.
Live
Linear
Issue tracking tied to component changes. Auto-creates issues when drift is detected.
Live
Slack
Deploy alerts, review pings, and diff summaries posted to your channels.
Live
VS Code
Extension with inline diff annotations. See component history without leaving your editor.
Live
Cursor
Origin diffs surface as Cursor suggestions. Accept/reject via the Agent Bridge.
Live
TypeScript
Type-safe component contracts. Prop inference from your TypeScript types.
Live
React
Component tree, hooks, and context all mapped to the graph. Full React Fiber integration.
Live
How it works

From connect to notify in four steps.

Every integration follows the same secure pipeline โ€” events flow in, diffs are computed, and your team is alerted in the tools they already use.

01

Connect

Authorize via OAuth or register a webhook. Originmain handles token refresh and credential storage with zero manual config.

02

Sync

Events flow into Originmain in real time. Each payload is verified with HMAC signatures before any processing begins.

03

Diff

Changes are automatically fed into the Intent Diff engine. Component-level diffs are computed and attributed to the triggering event.

04

Notify

Your team is alerted where they work โ€” a Slack message, a PR comment, a Linear issue update, or an inline editor annotation.

GitHub integration

Every merge computes
a full component diff.

When a PR is opened, Originmain receives the push event and immediately kicks off a component-level diff across the entire affected subtree. The result is posted back to the PR as a structured comment โ€” no manual review step.

  • โšกPR events trigger automatic diff computation the moment they are received.
  • Branch tracking keeps the Origin Graph in sync with every push โ€” not just merges.
  • Originmain posts a structured diff comment directly onto the GitHub PR for inline review.
Connect GitHub
Incoming webhook payload
{ "event": "pull_request", "action": "opened", "number": 142, "head": { "sha": "a4f3c2d", "ref": "feat/dashboard-v2" }, "x-hub-signature-256": "sha256=โ€ฆ" }
โœ“ HMAC verified ยท diff triggered
Computed component diff
~ DashboardHeader
- title: "Overview"
+ title: "Dashboard v2"
+ MetricCard (new)
+ metric="weekly_active"
+ format="number"
posted to PR #142
originmain-bot commented just now
Origin Diff โ€” 2 components changed, 1 added
View full diff on Originmain โ†’
Figma integration

Design changes update
the graph automatically.

Connect your Figma file and Originmain subscribes to every change. Design tokens, component definitions, and layout compositions are extracted and mapped directly into the Origin Graph โ€” no manual export, no hand-off step.

  • Design tokens (color, spacing, typography) are extracted and kept in sync as you iterate in Figma.
  • Component library updates propagate to every artboard that references them โ€” instantly.
  • Layout changes generate Intent Diffs that can be handed directly to the Agent Bridge.
Connect Figma
Figma โ†’ Origin Graph
color/brand/primary
#0066FF
synced
T
typography/heading/xl
900 / 4.5rem / -0.045em
synced
sp
spacing/lg
32px
updating
Component library โ€” 48 components
Button
Card
Input
Badge โ†‘
Setup in minutes

Built on secure, open standards.

Every integration uses platform-native authentication and cryptographic verification. No credentials stored in plaintext, no polling โ€” only push-based, event-driven architecture.

๐Ÿ”

HMAC verification

Every incoming webhook is verified with HMAC-SHA256 before processing. The shared secret is stored encrypted in Originmain's key vault โ€” never in environment variables or config files.

Security
โœ๏ธ

Webhook signatures

Each platform has its own signature header โ€” x-hub-signature-256 for GitHub, x-figma-signature for Figma. Originmain verifies each using the platform's prescribed algorithm.

Protocol
๐Ÿ“จ

Event types

Subscribe only to the events you need. Originmain exposes a per-integration event filter โ€” receive pull_request.opened and push from GitHub, or FILE_UPDATE from Figma.

Granularity
๐Ÿ”‘

OAuth flows

GitHub, Figma, Linear, and Slack all use standard OAuth 2.0 with PKCE. Tokens are refreshed automatically โ€” you authorize once and Originmain handles the rest without user intervention.

Authentication
โฑ

API rate limits

Originmain's integration layer respects every platform's rate limit with adaptive back-off and request queuing. High-volume repos with hundreds of daily PRs process without dropped events.

Reliability
๐Ÿ“‹

Audit logs

Every event received, every diff triggered, every notification sent is recorded with a timestamp and payload hash. Full audit trail available to workspace admins via the Originmain dashboard.

Compliance
Integration status

All integrations, all live.

Every integration ships fully operational on day one. Connect GitHub and Figma in under two minutes, then add Linear, Slack, and your editor tools from the dashboard.

GitHub

PR diffs & branch sync

Operational

Figma

Token & component sync

Operational

Linear

Issue & milestone sync

Operational

Slack

Alerts & diff summaries

Operational

VS Code

Inline diff annotations

Operational

Cursor

Agent Bridge suggestions

Operational

TypeScript

Type-safe prop contracts

Operational

React

Full Fiber tree mapping

Operational
Goes deeper with

Integrations power every feature.

The integration layer is the connective tissue of the whole platform โ€” every feature benefits from a connected workflow.

Your whole stack,
finally connected.

Connect GitHub and Figma in under two minutes. Every other integration is one click from the dashboard.