HelixForge — Brand Identity & Design System

Version 1.0 (2026)

"HelixForge envisions a world where software capabilities evolve with understanding, not guesswork. We evolve software capabilities by uniting human understanding and executable precision."

1. Executive Vision & Philosophy

HelixForge balances two opposing but complementary forces, structured like a double helix:

The Strand of Discovery (Human Meaning): Soft, organic text, fluid transitions, readable natural language typography, and spacious playgrounds that encourage exploration and natural-language clarity.
The Strand of Delivery (Machine Precision): Sharp borders, high-contrast monochrome bases, technical micro-interactions, data-dense layout matrices, and strict geometric structural grids.

2. Color Palette & Tailwind Configuration

The color palette directly mirrors the industrial crucible and the glowing double helix logo: a dark, tech-heavy canvas illuminated by shifting cyan-to-coral/amber gradients and sparks of the forge.

Color Specifications

Forge Background (#0B0F13): The deep, industrial workspace base.
Forge Muted BG (#141A22): Surfaces, cards, and secondary content blocks.
Forge Border (#222C3A): Hard engineering limits and structured guidelines.
Strand 1 - Discovery Cyan (#4DEEEA): Technical clarity, discovery, and active paths.
Strand 1 - Deep Blue (#247BA0): Structural anchors.
Strand 2 - Delivery Coral (#FF6B6B): Intent execution, human energy, and active sparks.
Strand 2 - Amber Spark (#FFA06A): Highlights, metrics, and warnings.
Text Primary (#F8FAFC): Crisp high-contrast visibility.
Text Muted (#94A3B8): Human commentary and descriptive context.

The complete Tailwind CSS plugin config configuration can be found in tailwind.config.js.

3. Typography Architecture

Headings (Structure & Precision): A geometric, slightly futuristic Sans-Serif design system font (e.g., Inter, Plus Jakarta Sans, or Syncopate for logos) to represent rigid frameworks.
Body Copy (Human Meaning): Highly readable, modern human-centric Sans-Serif system fonts (Inter, SF Pro, or Roboto).
Executable Code (The Truth): High-fidelity, perfectly aligned monospaced layout systems (JetBrains Mono, Fira Code).

4. System File Directory (Assets Included)

The attached ZIP archive contains all ready-to-implement structural assets for the Tailwind system layout implementation:

tailwind.config.js - Color definitions, typography extending, background gradients.
global.css - Custom utilities, ambient glows, dot matrices, and custom animations.
components.html - Raw HTML playground templates featuring Buttons, Cards, Dividers, and Split Screen UI layouts.

2.8 KiB Executable File Raw Blame History