Inclusive spaces in deep petrol

# Coordinate volunteers and events with a calm, readable interface.

This light-mode preview shows how deep petrol, a warm complementary accent, and a small set of support colours behave in a realistic one-page layout with login, events, and community context.

Primary: deep petrol for key actions and brand. Accent: warm clay for emphasis and highlights. Support: muted violet for tags and tertiary UI.

## Login to your space

Secure access to organiser tools and volunteer coordination.
Petrol theme
Email address

Use the email you registered for events or volunteering.

Password

We never store your password in plain text.

Remember this device Forgot password?

### Upcoming

## Events and meetups

This section shows how petrol and its supporters behave in a more content-heavy context with lists, dates, and tags.

- 21 Jul · 19:00
  Queer Tech & Privacy Meetup
  Köln · Hybrid · Organised by Petrol Commons
  Tech Privacy Community
- 28 Jul · 17:30
  Volunteer Onboarding
  Köln · In person · Accessibility-first
  Onboarding Training

### Palette notes

## How this colour system works

Deep petrol is reserved for brand anchors and primary actions. Secondary uses a cooler, slightly brighter tone for navigation and support buttons, while accent and support colours cover emphasis, tags, and highlights.

The neutral ramp handles most surfaces and text, keeping the interface calm and readable. Semantic colours remain distinct so success, warning, and danger states are never confused with the brand palette.