Skip to main content

​
Mill brand foundation

Mill uses a literal tower mill mark and a brown accent with neutral light and dark surfaces. Use the supplied artwork and semantic theme tokens for application and documentation changes.

​
Assets

The same transparent mark works on light and dark surfaces. Asset derivatives retain the source artwork and alpha; they only change pixel dimensions for delivery. The application uses the shared MillMark component in navigation and the identity frame, including consent. Images have reserved dimensions, preserve their proportions, and are decorative beside the visible Mill name. The generation prompt was: “Literal tower mill with four cream sails, tapered cocoa-brown tower, brown cap and small door. Towbar-style miniature 3D object, three-quarter orthographic perspective, smooth materials, rounded bevels, minimal broad seams, strong silhouette at 32px, transparent background, no lettering or badge.” The final refinement used the original Mill draft as the edit target and Towbar’s logo as a style reference. No Towbar artwork is shipped in Mill. The asset pack also includes light/dark wordmarks and lockups, a currentColor monochrome SVG, and a 1200×630 social preview. SVG wordmarks use Inter with system sans-serif fallback; lockups embed the delivered mark, while the social composition embeds the full-resolution source. The monochrome mark is a separate flat vector adaptation for single-color use.

​
Theme

Theme tokens override HeroUI’s semantic roles through the existing CSS base layer. Cocoa accents sit on nearly neutral white and gray surfaces in light mode, with light brown accents on near-black surfaces in dark mode. Secondary controls, tables, menus, dialogs, focus rings and accent chips derive their colors from those roles. Success, warning and danger hues retain their existing semantic definitions. The brand module and browser theme-color use the matching background values. Metadata uses their sRGB hex equivalents for browser compatibility: light #f7f7f6 and dark #060605. The initial browser theme-color matches the light background and tracks the active theme after initialization. CSS tokens remain OKLCH. The declarations below set Mill’s semantic colors. Derived hover, soft, foreground, and focus roles use the shared theme formulas. Review contrast in the rendered component states when changing these tokens.