taste-skill / Compare styles / Trigger.dev vs Inngest

Trigger.dev vs Inngest: design style comparison

Trigger.dev is Industrial Dark Slate & Electric Acid-Lime Telemetry; Inngest is Warm Obsidian Stone & Swiss Whyte / Coral-Cobalt Contrast. Both were extracted with the same taste-skill pipeline, so every value below is directly comparable. 17 of 18 tracked tokens differ.

Side-by-side preview

Trigger.dev style · dark

Ship the product, not the pixels.

Preview text rendered with the extracted Trigger.dev canvas, text, muted and accent tokens.

AI agents Media processing

Card on extracted card recipe

Accent link: #A8FF53 · border #1C1E21

Inngest style · dark

Ship the product, not the pixels.

Preview text rendered with the extracted Inngest canvas, text, muted and accent tokens.

START FREE READ THE DOCS

Card on extracted card recipe

Accent link: #F76246 · border rgba(255, 255, 255, 0.08)

Key differences

Both are dark-mode designs, but the canvases differ: #121317 vs #0C0A09.
Accent: #A8FF53 (Trigger.dev) vs #F76246 (Inngest).
Headings: Satoshi-Variable vs WhyteV1.
Display type: Trigger.dev H1 is 60px / 1.0 (w600); Inngest H1 is 72px / 0.95 (w400) — Inngest sets 12px larger headlines.
Primary button radius: 4px vs 6px; height 40px vs 42px.
Depth: Trigger.dev uses rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 0px 1px 2px 0px most; Inngest uses rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgb(28, 28, 28) 0px 0px 0px 2px most.
Motion: cubic-bezier(0.4, 0, 0.2, 1) vs cubic-bezier(0.2, 0.8, 0.2, 1).

Token table

Token	Trigger.dev	Inngest
Canvas	`#121317`	`#0C0A09`
Surface	`#15171A`	`#1C1C1C`
Text	`#D7D9DD`	`#FFFFFF`
Muted text	`#878C99`	`#A8A29E`
Accent	`#A8FF53`	`#F76246`
Border	`#1C1E21`	`rgba(255, 255, 255, 0.08)`
Heading font	`Satoshi-Variable`	`WhyteV1`
Body font	`Inter / Satoshi`	`Inter / Whyte`
Mono font	`Geist Mono`	`CircularXXMono`
H1	`60px / 1.0 (w600)`	`72px / 0.95 (w400)`
Button radius	`4px`	`6px`
Button height	`40px`	`42px`
Most-used radius	`4px`	`6px`
Most-used shadow	`rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 0px 1px 2px 0px`	`rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgb(28, 28, 28) 0px 0px 0px 2px`
Easing	`cubic-bezier(0.4, 0, 0.2, 1)`	`cubic-bezier(0.2, 0.8, 0.2, 1)`
Duration	`0.15s`	`0.3s`
Container max-width	`1224px`	`1440px`
Mode same	`dark`	`dark`

Primary buttons

Rendered	Height	Padding	Radius	Background / Text	Border	Font
AI agents	40px	`0px 12px`	`4px`	`#212327` `#D7D9DD`	`1px solid #1C1E21`	`16px / 400`
Media processing	40px	`0px 12px`	`4px`	`#121317` `#B5B8C0`	`1px solid #1C1E21`	`16px / 400`

Rendered	Height	Padding	Radius	Background / Text	Border	Font
START FREE	42px	`0px 20px`	`6px`	`#FFFFFF` `#000000`	`none`	`12px / 600`
READ THE DOCS	42px	`0px 20px`	`6px`	`transparent` `#FFFFFF`	`none`	`12px / 600`
START FREE	32px	`0px 20px`	`6px`	`#FFFFFF` `#000000`	`none`	`12px / 600`

Which style should you pick?

Pick Trigger.dev if you want Deep gunmetal #121317 canvas with #15171A / #212327 workflow nodes, #1C1E21 structural borders, 60px Satoshi-Variable headings, Geist Mono logs, and #A8FF53 electric lime status accents — signals: background-jobs, acid-lime, neon-green, trigger, satoshi, geist-mono, industrial.

Pick Inngest if you want Warm obsidian stone #0C0A09 canvas with rgba(28,28,28,0.85) surfaces, 72px WhyteV1 architectural display headings (0.95 line-height), CircularXXMono code, and #F76246 coral + #013CF6 cobalt accents — signals: queues, ai-orchestration, inngest, whyte, coral, cobalt, warm-dark.

Shared traits: dark, devtools, workflows.

Rules that differ

Trigger.dev never:

NEVER substitute generic uncalibrated gray backgrounds for Trigger.dev’s exact #121317 canvas and #15171A surface pairing.
NEVER replace Satoshi-Variable display typography or ignore its signature scale (60px / 1.0 (w600)).
NEVER use thick opaque borders that clash with #1C1E21 (1px solid #1C1E21).

Inngest never:

NEVER substitute generic uncalibrated gray backgrounds for Inngest’s exact #0C0A09 canvas and #1C1C1C surface pairing.
NEVER replace WhyteV1 display typography or ignore its signature scale (72px / 0.95 (w400)).
NEVER use thick opaque borders that clash with rgba(255, 255, 255, 0.08) (1px rgba(255,255,255,0.08)).

Go deeper

Trigger.dev style guide Inngest style guide Trigger.dev token spec Inngest token spec Trigger.dev vs Neon

Values extracted from https://trigger.dev and https://www.inngest.com. Not affiliated with either company.

Get all 30 full SKILL.md specs (Cursor / Claude Code / Codex ready) plus the Pro growth skills.

See taste-skill Pro →