---
schema_version: 1
id: "bauhaus-geometric"
name: "Bauhaus Geometric"
summary: "Elementary shapes, flat color planes and an orthogonal modular grid for culture and graphic work."
family: "expressive"
tags: ["geometric", "poster", "high-contrast"]
best_for: ["events", "culture", "portfolio"]
avoid_for: []
density: "balanced"
image_dependency: "low"
motion_level: "subtle"
complexity: "low"
signature: {"composition": "Orthogonal poster modules and an unequal modular exhibition; shapes occupy real space.", "typography": "Large plain sans-serif display, short numbered labels and clear practical copy.", "navigation": "Visible programme/context links and a separate work index.", "content_rhythm": "Poster, compact timed rows and statement plane; or three unequal work stages.", "imagery": "Original code-native CSS geometric compositions, no external assets.", "color_and_material": "Warm paper, black, red, blue and yellow flat semantic planes.", "interaction": "Working local anchors and native practical-note disclosure; no fake ticketing.", "motion": "Static geometry and brief link-color transitions removed for reduced motion."}
status: "ready"
prompt_path: prompts/bauhaus-geometric/prompt.en.md
---

# Bauhaus Geometric

## Intent

Bauhaus Geometric uses simple geometric relationships to organize a contemporary culture page. The fictional Gridmoot gathering brings workshops, talks and original composition studies into a disciplined visual system. It suits events, cultural programmes and graphic portfolios. This is an original modern interpretation, not a reproduction of a historical poster or a claim of institutional affiliation. Shapes should create meaningful spatial emphasis while ordinary text and links explain what visitors can actually do.

## Signature

Retain four invariants: elementary circles, squares and triangles that occupy real layout space; an orthogonal modular grid; a limited primary-color vocabulary; and large plain sans-serif type aligned to the same modules. A is an event poster with a separate programme rhythm. B is a modular exhibition of three composition studies. The geometry is not a small decorative icon pasted onto a conventional landing page. Each major shape establishes weight, balance or a boundary between content areas.

## Typography

Use system Arial and a sans-serif fallback with clear bold display and regular supporting text. Short display lines may sit close together, but essential words must not collide or fall outside the viewport. Small numbered labels establish sequence without becoming the only navigation. Practical descriptions use comfortable line height and enough width to read naturally. Keep the typographic palette small. The references include Lithuanian glyphs and do not depend on remote font downloads.

## Color and surfaces

A warm paper ground supports deep black text, red emphasis, a blue plane and a yellow field. These additional color roles are explicit semantic tokens, with readable on-color roles where text uses a colored surface. Shapes can be saturated without covering body copy. Thin structural rules help alignment, while thick decorative outlines are intentionally absent. Avoid expanding the palette into arbitrary gradients: the relationships between a few flat planes should remain visible in a still image.

## Layout A

A small assembly header leads to a poster grid. The headline occupies one large module, a geometric field occupies the other, and a compact date strip ties them together. Below, the programme uses short timed rows instead of enclosed feature cards. A wide statement pairs a blue plane with a short explanation of the event premise. A native practical-note disclosure and a link to the separate exhibition close the page. Every event and venue detail is explicitly fictional.

## Layout B

Begin with a compact exhibition introduction and a local work index. Present three original CSS composition studies on unequal modules: a square-and-disc balance, a triangular diagonal and a wide circular sequence. Attach each work’s number, title and short compositional explanation to its stage. A final note explains the process and returns to the event poster. The visitor is browsing a body of work rather than reading the event programme, so the content structure and page rhythm differ from A.

## Imagery

The references need no external photographs, fonts or image files. Original CSS circles, triangles and planes form the artwork directly in the page. Decorative fields are hidden from assistive technology while adjacent captions explain their purpose. An empty asset registry reflects that there are no separate redistributed media files. If adapting to real artworks, preserve their original proportions and record their rights; do not label these fictional CSS studies as historic Bauhaus works or borrow an unlicensed museum reproduction.

## Navigation and interaction

Visible navigation connects the programme, event context and separate exhibition. The exhibition’s local index links to real work sections. A native disclosure provides practical demonstration information, and all links have a visible keyboard focus outline. Geometry never blocks a control or serves as an unlabeled button. There is no simulated ticket purchase or empty registration form. A real event adaptation must add truthful booking destinations and accessible form states as implemented features.

## Motion

The geometric composition is complete without movement. Brief link-color transitions are the only optional motion, removed by reduced-motion preferences. Do not spin every circle or slide triangles across the reading path merely because the event discusses form. If a future adaptation animates a construction study, keep an equivalent static image or explanation and avoid taking control of scrolling. A screenshot should reveal the intended balance, and no essential title should depend on an entrance animation.

## Responsive behavior

At desktop widths A uses two large adjacent poster modules and a broad programme line. B uses unequal exhibition stages, with the third work spanning the grid. At tablet widths reduce display scale and outer padding while keeping the primary shapes legible. At 360 pixels the poster becomes a clear vertical sequence and the exhibition becomes one work per row. Preserve complete shape boundaries inside their stages and let the work index wrap naturally rather than forcing horizontal scrolling.

## Accessibility

The pages target readable token contrast, one page heading, clear landmarks and visible focus. Decorative geometric fields do not create redundant image announcements. Text remains separate from busy shape intersections and uses tested on-color roles where applicable. Actual browser evidence records resources, controls, disclosures, responsive overflow and axe results across six combinations. Glyph loading, reduced motion and real token consumption receive separate checks. Visual hierarchy and geometric balance still require actual preview inspection; automated checks do not certify every adaptation.

## Adaptation

Start with the content task and assign major information groups to modules before drawing decorative shapes. For another event, replace the fictional dates, venue and programme with verified information. For a portfolio, use original or licensed work and keep captions attached to each stage. The same principles can move into WordPress or React without a canvas renderer. Preserve the geometric-to-text scale relationship, flat limited palette and distinct poster/exhibition tasks rather than copying the demo’s exact words.

## Avoid

1. Do not paste tiny circles onto a generic hero-and-cards layout and call it geometric; the forms must establish spatial structure. 2. Do not replace disciplined modules with thick outlined stickers and random rotations; that belongs to a different expressive direction. 3. Do not hide text or controls behind moving shapes or imply real ticketing through inert actions.

## Closest styles

Neo Brutalist is the nearest available neighbor. Bauhaus Geometric uses aligned flat shape planes rather than heavy exposed frames; section and work-index navigation replaces the programme’s day-filter emphasis; and spatial modules alternate with compact programme rows rather than loud framed bands. Swiss Grid provides a second comparison: it makes typography and numbered rules the main geometry, while this direction gives elementary colored forms major independent spatial weight. Similar event subject matter does not explain these structural differences.