Primitive Token

A primitive token is the single source of truth for your brand's raw visual DNA. It holds literal values with zero context or intent attached. Color yellow 400 equals FFC44D. Spacing 3xl equals 48. Motion duration base equals 240ms. Border radius pill equals 9999. These sit at the bottom of the three layer system the 2026 brand book demands. Primitives feed semantic tokens that add meaning like color background hero. Semantic tokens then feed component tokens like button primary fill. The entire chain lives in JSON or Tokens Studio so one edit to a primitive cascades everywhere. Your junior designer your frontend engineer your LLM content tool and your After Effects template all read from the same bedrock. This replaces the sad hex list buried on page 12 of the old PDF nobody opened since 2021. Primitives make rebranding a refactor instead of six months of manual labor across Figma Canva and Midjourney. They turn design decisions into infrastructure that scales when your team grows from three people to thirty or when your output moves from static campaigns to AI generated social variants at eight aspect ratios. Naming matters here. Use numbered scales like 50 through 950 for colors following patterns from Tailwind and Material Design. Keep values flat and stupidly literal. Never add brand meaning at this layer. That comes later. Primitive tokens also cover typography scale font weights line heights shadow definitions and easing curves. They become the foundation that lets you ship light mode dark mode and seasonal themes by swapping one JSON file instead of redesigning every screen. In the voxel tree diagram from the brand identity guidelines piece primitives form the roots. Everything alive above them depends on their stability. Without clean primitives your semantic layer collapses into guesswork and your component tokens turn into hardcoded spaghetti that breaks the first time legal asks for a color tweak. A primitive token is not a semantic token. It does not know it is your accent color or your success state or your hero background. That is semantic work. A primitive token is not the value you attach directly to a button in Figma or a div in production code. Doing so skips the entire point of the system and leaves you unable to pivot when the CEO decides yellow feels too playful in Q3. It is not inspiration pulled from a Pinterest board or a loose style in an old brand deck. It is not marketing language. You never show your primitive set to the CMO and ask if the orange feels energetic enough. These tokens live in the machine layer where designers tools and AI all read them without emotion or interpretation. They are also not flexible suggestions. Once set a primitive token becomes law until the next major version. If you treat them like casual recommendations you destroy the consistency the whole system exists to protect. Stop storing raw values in scattered Figma styles or CSS files like it is still 2018. That workflow dies the moment your team ships more than ten assets per week. Concrete example hits in 2025 when the fintech company Brex rebuilt their entire system after their Series C. Their primitive color set contained blue 600 set to 0052FF and neutral 900 set to 0F172A. Semantic token color text primary pointed at neutral 900. Component token navbar background pointed at the semantic token. When they acquired a smaller startup and needed to blend both palettes they updated exactly seven primitive values in Tokens Studio. Every Figma component every React Storybook instance every AI generated LinkedIn carousel and every Framer motion prototype updated in one push. No designer opened two hundred frames to manually swap colors. Their motion primitives told the same story. Duration fast set to 180ms duration slow set to 420ms. These fed semantic motion tokens for micro interactions which then defined component tokens for card hover states. The result was a dashboard that felt snappy on web felt smooth on mobile and stayed on brand when their social team generated eight video variants in CapCut. Another concrete case comes from IBM Carbon in its 2024 refresh. Primitive radius tokens like border radius medium set to 4px and border radius large set to 8px became the base for every card corner every button roundness and every data visualization container. When accessibility audits demanded softer corners for focus states they adjusted two primitives and the change rippled through their entire design system documentation their React library and the internal LLM tool that generates UI copy paired with matching visuals. Shopify Polaris offers a third example. Their primitive type scale sets base at 16px with multipliers that create a perfect modular rhythm. These primitives feed semantic heading 1 through heading 6 which then lock into component tokens for product cards and checkout flows. The system let them launch a new checkout experience across 1.2 million merchants without a single merchant seeing broken typography. When to use primitive tokens is simple. Deploy them the moment your brand assets leave a single designer hands and enter Figma variables multiple tools AI generators or distributed teams. They become non negotiable when you maintain more than two product surfaces or when you plan any rebrand darker mode or seasonal campaign in the next eighteen months. Install them in Tokens Studio sync them to GitHub publish the JSON so your engineers pull the exact same values your designers use. Audit your current brand colors typography spacing and motion then convert every hardcoded value into a primitive before you build the semantic layer on top. Use them when you want your 2026 brand book to function as infrastructure instead of decoration. Do not use primitive tokens when you are a solo freelancer delivering three pitch decks a year. Do not bother when your entire output lives inside one static website that never changes. Skip the full primitive semantic component stack if your team still treats the brand book as a PDF uploaded to Google Drive and forgotten. They add overhead that small local businesses or one off campaign projects simply do not need. If you cannot version control them or feed them to an LLM system prompt then you are over engineering for the sake of sounding advanced. Primitive tokens turn rebranding from a six month design death march into a one afternoon variable swap.