Bauhaus geometric brand website

Arrange a brand and its projects through flat primary colors, square corners and asymmetric geometry, delivering a complete Bauhaus website. A compact direction to help the next screen feel deliberate, specific, and easy to remix.

Create a complete Bauhaus geometric brand website as frontend page code, not design-history advice or tokens alone. Use a tool that generates HTML/CSS.

INPUT
Brand: [name, discipline, audience, positioning]
Projects/products: [2–6 actual names, descriptions, available images and actual detail URLs]
Services/story: [actual services, introduction, working method]
Primary action: [real enquiry, purchase or contact address and label]
Visual constraints: [allowed red/blue/yellow, licensed logo/fonts/images, prohibited elements]
Delivery: [standalone index.html by default or specified stack; Chinese/English]

MISSING INFORMATION
Ask at most three blocking questions. Mark noncritical gaps [To supply] or reduce sections. Without photos, use labeled geometric placeholders; never invent actual product photos, clients, history or awards. Explicit fictional demos are consistently identified. If the brand requires rounded cards, gradients, gold ornament or bans all primaries, flag the style conflict and request a choice rather than silently mixing styles.

MAKE
1. Map actual content to navigation, geometric hero/core statement, projects/products, services or working method, brand story, primary action and footer. Merge sections when content is limited. Never introduce achievements, purchasing APIs or reservation functionality to match a template.
2. Use an eight- or twelve-column grid with asymmetric balance. Circles, squares and triangles organize composition/zones; at least two pure shapes remain visible without covering text/actions. Rectangles have 0px radius, flat solid fills and no shadows/glass/gradients. Base near-white #F5F5F0 and near-black #1A1A1A; one of red #E63B2E, blue #1B4D8E or yellow #F2C41D dominates, with restrained secondary primaries.
3. Use available geometric sans headings and readable body type with Chinese system fallbacks. Oversized type structures the layout, while body text keeps normal spacing/sentence case. English uppercase is limited to short labels. Separate content through solid blocks, hairlines and weight rather than shadow/rounded elevation. Preserve supplied image subjects/proportions; geometric decoration is not statistical data.
4. Clear square filled/outlined buttons use real targets. Without purchase/enquiry integration, never claim transactions or send success. Workflows can be static steps; required forms use visible labels, actual validation and explicit submission capability. Mobile becomes one column and rearranges/scales shapes without squeezing copy.
5. Use semantic sections, keyboard navigation, visible focus and suitable touch areas. Hide decoration from assistive technology and allow long Chinese text to wrap. Test actual text/background contrast; reserve yellow for decoration or pair with dark text instead of assuming white labels work. Motion is brief/optional and static for reduced motion. Check 390px/1440px, long names, no images, one project and no action URL.

DELIVER
A. Brief structure/content map, palette choices and gaps.
B. Complete index.html with inline CSS/necessary JS and all copy, saveable for preview; provide full required files for a requested stack, not just design tokens.
C. Style checklist: square corners / solid color / geometry / asymmetry; actual behavior and performed/pending checks.
Do not repeat untested contrast, business-outcome or performance claims from source guidance. Mark page verification pending when it cannot be run.

Site adaptation of Heiberg Industries / Designbrief, Bauhaus (MIT). Retains geometry, primaries, square corners and asymmetry; the site adds full-page structure, factual boundaries and delivery requirements: https://github.com/Heiberg-Industries/designbrief/blob/6b22ff3794eb2fe8d526ff32a3067022fa3ed6b6/styles/bauhaus.md . Copyright (c) 2026 Heiberg Industries (https://heiberg.co). Full license: https://github.com/Heiberg-Industries/designbrief/blob/6b22ff3794eb2fe8d526ff32a3067022fa3ed6b6/LICENSE .

tokens instead of a page, gold Art Deco mixing, rounded gradients/shadows, invented history/achievements, decorations blocking actions, unchecked white-on-yellow type, fake purchase/reservation, truncated mobile copy