📄 content-v2.json 3,305 bytes Apr 22, 2026 📋 Raw

{
"version": "2.0",
"name": "Blog Content Pipeline v2",
"description": "Design tokens for struggle-first content generation UI",

"colors": {
"struggle": {
"high": {
"value": "#22c55e",
"description": "Score 80-100 - Strong struggle narrative"
},
"medium": {
"value": "#eab308",
"description": "Score 50-79 - Moderate struggle elements"
},
"low": {
"value": "#ef4444",
"description": "Score 0-49 - Needs more personal stakes"
}
},
"validation": {
"pass": {
"value": "#22c55e",
"description": "Checklist item complete"
},
"fail": {
"value": "#ef4444",
"description": "Checklist item incomplete"
},
"pending": {
"value": "#6b7280",
"description": "Checklist item not yet validated"
}
},
"progress": {
"track": {
"value": "#e5e7eb",
"description": "Progress bar background"
},
"fill": {
"value": "#1a8917",
"description": "Progress bar fill (primary brand)"
}
}
},

"spacing": {
"brief-section-gap": {
"value": "1.5rem",
"description": "Gap between form sections"
},
"progress-sticky-top": {
"value": "1rem",
"description": "Top offset for sticky progress"
},
"card-padding": {
"value": "1.5rem",
"description": "Internal padding for cards"
},
"section-indent": {
"value": "1rem",
"description": "Left indent for nested content"
}
},

"preview": {
"pane-width": {
"value": "50%",
"description": "Width of each pane in side-by-side"
},
"min-width": {
"value": "320px",
"description": "Minimum pane width before stacking"
},
"divider-color": {
"value": "#e5e7eb",
"description": "Vertical divider between panes"
}
},

"typography": {
"brief-section-title": {
"size": "1.125rem",
"weight": "600",
"description": "Section headers in brief form"
},
"brief-hint": {
"size": "0.875rem",
"color": "#6b7280",
"description": "Helper text under section titles"
},
"score-number": {
"size": "2rem",
"weight": "700",
"description": "Large struggle score display"
}
},

"animation": {
"check-pop": {
"duration": "200ms",
"easing": "cubic-bezier(0.34, 1.56, 0.64, 1)",
"description": "Checkmark pop-in animation"
},
"section-collapse": {
"duration": "300ms",
"easing": "ease-out",
"description": "Form section expand/collapse"
},
"progress-fill": {
"duration": "150ms",
"easing": "ease-out",
"description": "Progress bar smooth fill"
},
"button-pulse": {
"duration": "1.5s",
"easing": "ease-in-out",
"iteration": "infinite",
"description": "Generate button when enabled"
}
},

"breakpoints": {
"mobile": {
"max": "767px",
"description": "Mobile: single column, wizard mode"
},
"tablet": {
"min": "768px",
"max": "1023px",
"description": "Tablet: tabbed interface"
},
"desktop": {
"min": "1024px",
"description": "Desktop: side-by-side layout"
}
}
}