SpaceWorks-Design

Brand design assets for Space Works.

Options/

Seven candidate brand marks, each split into its own folder. Per option:

File	What
mark-dark.svg	Standalone mark, white stroke, for dark backgrounds #0c0d10 (64×64).
mark-light.svg	Standalone mark, ink stroke #16181d, for light backgrounds #faf9f4 (64×64).
app-icon.svg	Mark inset on a rounded dark square with a soft radial sheen (512px).
app-icon.html	App-icon composition, dark & light.
favicon.svg	Bold full-bleed mark on a flat dark rounded square (64px, reads at 16px).
favicon.html	Favicon at 64 / 32 / 16.
banner.svg	Wide 1500×500 banner — mark + "Space Works" wordmark on dark.
banner.html	Banner preview.
brand-kit.html	Full sheet — primary logo, stacked, app icon, favicon, header, avatar + palette.

Options: 01-parts-crate, 02-wrench-node, 03-pegboard-hex, 05-member-node-graph, 07-circuit-crate, 08-hackerspace-patch, 09-toolbox-tab.

Shared palette: blue #7dd3fc, yellow #fcdf46, mint #74dd9c, pink #f9a8d4; dark #0c0d10, cream #faf9f4. Fonts: Clash Display (wordmark) + Instrument Sans (UI).

SVG banner text uses Clash Display via a webfont @import; it renders correctly in a browser but falls back to a system sans in offline design tools.

Source

• Selected Marks - Full Kits.html — original self-contained React/Babel design bundle (all 7 kits).
• design-canvas.jsx — the DesignCanvas component source.
• tools/generate-options.mjs — regenerates Options/ from the marks. Run: node tools/generate-options.mjs.
• source/ — Design-Canvas exports: SWMark.dc.html (the mark component, all 7 paths), Space Works - Brand Kits.dc.html (the full-kits sheet), support.js (DC runtime the .dc.html files load via ./support.js), and marks-README.txt (the original marks spec).