Theme · Product · Intermediate
Linear-style Issue Tracker
Linear-style tracker = a cycle progress bar, view chips, and grouped issue rows with status icons and mono IDs.
Tips
Rows, not cards. Density is the point: mono IDs, legible status icons, an honest cycle bar.
See also
Build a Linear-style issue tracker called "Vector".
STYLE
- Dark canvas (#0f1011) with hairline rgba(255,255,255,0.06) dividers
- Linear indigo (#5e6ad2) accents; muted #8a8f98 meta text
- Tight sans; monospace issue IDs; no cards - rows only
LAYOUT
- Top bar: breadcrumb "Engineering / Active"; cycle widget "Cycle 24" + a 68% progress bar + "4 days left"; view chips All (on) / In Progress / Backlog
- Grouped issue list:
- In Progress (3): ENG-214 "Fix keyboard nav in command menu" (Bug - M), ENG-219 "Cycle analytics: burndown chart" (Feature - L) - half-filled yellow status icons
- Todo (2): ENG-221 "Offline mode for issue edits" (Feature - M, dashed icon), ENG-208 "Dark theme contrast audit" (Design - S, done icon)
- Tall adds Backlog (4): ENG-227 "Git integration: PR status in sidebar" (Feature - L)
- Each row: status icon, mono ID, title, label - priority meta, gradient avatar
COMPONENTS
- Top bar: breadcrumb, cycle widget with progress bar and days left, view chips
- Grouped rows: In Progress (half icons), Todo (dashed icons)
- Row: status icon, mono ID, title, label-priority, avatar
INTERACTION
- Rows highlight on hover; status icons encode state by shape and fill; IDs stay monospace.
TECHNICAL
- React, Tailwind CSS, no board library, bespoke row list