00
DESIGN SYSTEM
One system. Every new page.
Every colour, text style and component this template is built from, on one page. Give it to the Agent as the reference when you build something new, and the new page comes out looking like the rest of the site.
/design-system
Type this in the Agent panel with your prompt to build your first page from this system.
Recommended model: GPT 5.6 Sol or above.
01
COLOURS
Nineteen tokens. Nothing hard-coded.
Every fill, border and text colour in the template points at one of these. Change a token and it changes everywhere it is used.
Background
BASE
rgb(7, 7, 7)
Cards
BASE
rgb(15, 15, 15)
Surface Soft
BASE
rgba(255, 255, 255, 0.06)
Transparent
BASE
rgba(255, 255, 255, 0)
V1
ACCENT
rgb(242, 65, 0)
Soft
ACCENT
rgba(242, 65, 0, 0.16)
Heading
TEXT
rgb(250, 250, 250)
Paragraph
TEXT
rgb(163, 163, 163)
V1
BORDER
rgba(255, 255, 255, 0.1)
V2
BORDER
rgba(255, 255, 255, 0.02)
On Light
BORDER
rgba(7, 7, 7, 0.15)
Success
STATUS
rgb(95, 209, 122)
Warning
STATUS
rgb(240, 180, 41)
Danger
STATUS
rgb(242, 109, 109)
Success Soft
STATUS
rgba(95, 209, 122, 0.16)
Warning Soft
STATUS
rgba(240, 180, 41, 0.18)
Danger Soft
STATUS
rgba(242, 109, 109, 0.16)
Info Soft
STATUS
rgba(110, 140, 255, 0.2)
Highlight Row
STATUS
rgba(240, 180, 41, 0.05)
02
TYPOGRAPHY
Fifteen roles, two families.
Geist for the site, Geist Mono for the product UI. Every text uses one of these, so the type scale never drifts.
Ag
Headings/Heading 1
h1 · 4rem · 1em
Ag
Headings/Heading 2
h2 · 3rem · 1.1em
Agents that run the work
Headings/Heading 3
h3 · 1.5rem · 1.2em
Agents that run the work
Headings/Heading 4
h4 · 1.25rem · 1.4em
Agents that run the work
Headings/Heading 5
h5 · 1.125rem · 1.4em
Agents that run the work
Headings/Heading 6
h6 · 0.875rem · 1.3em
Syncore
Interface/Logo Text
p · 1.25rem · 1.2em
Start free
Interface/Text Button
p · 0.875rem · 1.2em
Build the workflow once, then let the agents run it.
Paragraphs/Text Main
p · 1rem · 1.4em
Build the workflow once, then let the agents run it.
Paragraphs/Text Small
p · 0.8125rem · 1.4em
BUILT FOR OPERATIONS
Paragraphs/Text Tiny
p · 0.6875rem · 1.4em
1,284 runs
Product UI/Mono Large
p · 22px · 1.1em
run_id 8841 · completed
Product UI/Mono Text
p · 13px · 1.4em
run_id 8841 · completed
Product UI/Mono Small
p · 11px · 1.4em
↳
Product UI/Glyph
p · 12px · 1em
03
COMPONENTS
Every component, one card each.
Each card shows the component in its main state. Point the Agent at the one you want and it reuses it instead of drawing something new.
Controls
buttons, badges, markers
Button Primary
Component
Contact Form Button
Component
Newsletter Button
Component
available for work
Section Tag
Component
Dots Item
Component
Menu Link
Component
Logo Item
Component
Yes
Check Item
Component
Completed
Status
Component
Latest run
Tag
Component
Overview
6
Tab
Component
3/3 steps
Steps
Component
Contact Info Item
Component
Cards
repeatable content blocks
Design Retainer
For teams with focused design needs.
/month
Automation engine
AI workflow agent
Execution monitoring
Real-time analytics
Core integrations
Up to 5 workflows
Pricing Card
Component
Unlimited requests
Pricing Features Item
Component
Metrix Card
Component
Subscribe
Choose a plan and get instant access to your design workspace. No long-term contracts. Cancel or pause anytime.
Primary Card
Component
Arlene McCoy
Co-Founder, CEO
Team Card
Component
Reviews Card
Component
Define automation using simple, explicit logic
Features Item
Component
01
Define the Trigger
Set up event-based triggers that activate workflows automatically based on real-time inputs from connected tools.
CHOOSE A TRIGGER
step 1
Form submitted
Webflow
New CRM record
HubSpot
Schedule
Every hour
Incoming webhook
Any app
Process Card
Component
RUNS TODAY
1,284
+12%
Stat
Component
→
TRIGGER
Form submitted
0.1s
Flow Node
Component
Lead enrichment
Published
→
TRIGGER
Form submitted
Webflow · 0.1s
✦
AI STEP
Enrich & score lead
AI · 1.2s
?
CONDITION
Score above 70
0.0s
✓
ACTION
Create deal
HubSpot · 0.3s
✦
Notify #sales in Slack
Apply →
Workflow Builder
Component
AGENT RUN · Lead enrichment
done
⚡
Trigger received
✓
◎
Evaluate lead intent
✓
?
Score above 70
✓
+
Assign sales owner
✓
↗
Log to analytics
✓
Agent Run
Component
RUN LOG · live
00:01:24
> Trigger received: Webflow form
✓ Context loaded · 24 fields
> AI agent scoring lead
→ Deal created in HubSpot
! Score below threshold, queued
> Retry scheduled in 30s
✓ Intent matched on retry
> Notifying #sales in Slack
✓ Owner assigned: Ops Team
✓ Row appended to Sheets
✓ Run completed in 00:01:24
Run Log
Component
LAST 7 DAYS
98.9% success
1,142
SUCCESS
96
RUNNING
12
FAILED
Avg duration 01:12
Open report →
Analytics
Component
CHOOSE A TRIGGER
step 1
Form submitted
Webflow
New CRM record
HubSpot
Schedule
Every hour
Incoming webhook
Any app
Trigger Picker
Component
RULES
step 2
IF
Lead score > 70
AND
Region is EU
THEN
Assign to sales owner
ELSE
Add to nurture list
Logic Builder
Component
LIVE RUN · Lead enrichment
step 3
2/3 steps · running
00:00:42
✓ Trigger received
✓ Lead scored · 82
> Creating deal in HubSpot
· waiting for CRM response
✓ Deal created · #4821
Run Monitor
Component
CONNECTED APPS
24 active
◆
Slack
synced
▣
Notion
synced
◈
HubSpot
synced
◉
Stripe
syncing
▤
Google Sheets
synced
◇
Webflow
synced
+18 more available
Browse library →
Integrations
Component
Newsletter
Component
Contact Form
Component
Corners
Component
Sections
full-width blocks, shown at page width
Overview
One Platform for Every Automation
Connect your tools, design the flow and let Syncore run it — with every step visible.
Section Head
Component
Navbar
Component
Footer
Component
Get Started
Your Automation Starts Right Here
Create intelligent workflows, connect your tools, and turn manual work into automated infrastructure.
Syncore
/
Production
/
Workflows
Live
· synced 12s ago
RUNS TODAY
1,284
+12%
SUCCESS RATE
98.9%
+0.4%
AVG DURATION
01:12
-8s
ACTIVE ISSUES
1
Needs review
Overview
6
Runs
2
Workflows
4
Activity
Last 24h
↓
STATUS
WORKFLOW
PROGRESS
TRIGGERED BY
DURATION
Completed
Lead enrichment
Auto-triggered
Latest run
3/3 steps
A
AI Agent
00:01:24
Running
Invoice processing
Scheduled
Step 2 of 3
2/3 steps
O
Ops Team
00:00:42
Completed
CRM sync
Webhook
Latest run
3/3 steps
S
System
00:02:31
Failed
Support ticket routing
Manual run
Needs review
Failed at 2/3
M
Marketing
00:00:58
Showing 4 of 128 workflows
View all runs →
CTA
Component
Pricing Component
Component
Compare Table
Component
AI Smart Replies
Compare Item
Component
What is a visual automation workspace?
Do I need coding experience to build workflows?
Which tools can I integrate with?
How does the AI Suggestions feature work?
Can I modify workflows after they are published?
What makes this different from traditional tools?
Is my data secure?
Is there a free trial available?
FAQs Component
Component
Question
Answer
Helper/FAQ Item
Component
Reviews Card Large
Component
AGENT RUN · Lead enrichment
done
⚡
Trigger received
✓
◎
Evaluate lead intent
✓
?
Score above 70
✓
+
Assign sales owner
✓
↗
Log to analytics
✓
AI Workflow Agent
Deploy intelligent agents that analyze inputs, evaluate context, and execute multi-step automation flows autonomously.
Context-aware decision logic
Autonomous multi-step execution
Intelligent action recommendations
Features Card
Component
Version 1.0.0
Data
Visual Automation Workspace
Content
Changelog Item
Component
Completed
Lead enrichment
Auto-triggered
Latest run
3/3 steps
A
AI Agent
00:01:24
Workflow Row
Component
Syncore
/
Production
/
Workflows
Live
· synced 12s ago
RUNS TODAY
1,284
+12%
SUCCESS RATE
98.9%
+0.4%
AVG DURATION
01:12
-8s
ACTIVE ISSUES
1
Needs review
Overview
6
Runs
2
Workflows
4
Activity
Last 24h
↓
STATUS
WORKFLOW
PROGRESS
TRIGGERED BY
DURATION
Completed
Lead enrichment
Auto-triggered
Latest run
3/3 steps
A
AI Agent
00:01:24
Running
Invoice processing
Scheduled
Step 2 of 3
2/3 steps
O
Ops Team
00:00:42
Completed
CRM sync
Webhook
Latest run
3/3 steps
S
System
00:02:31
Failed
Support ticket routing
Manual run
Needs review
Failed at 2/3
M
Marketing
00:00:58
Showing 4 of 128 workflows
View all runs →
Workflow Dashboard
Component
Background Component
Component
Spacer
Component
04
CODE COMPONENTS
Three coded pieces, edited like any other.
These carry the interaction the canvas cannot. They follow the text styles and colour tokens above, and their content is a list on the instance.
Digit Up
Code
Logo Slider
Code
Applied to the footer year as a code override, so the copyright line stays current on its own. It has no visual of its own.
Current Year
Code override