Brand-System · Stand 09.09.2026
Brand-System · Stand 09.09.2026
Energieberatung · Chemnitz und Umgebung
Ich rechne dir aus, was Photovoltaik, Wärmepumpe und ein anderer Tarif bei dir zusammen bringen. Vorher, nicht hinterher.
Die gestalterische Idee
Jede Zahl steht als abgelesener Wert an einer Ablesekante — mit Quelle und Erhebungsdatum darunter. Fünf Zeilen, immer dieselbe Anatomie, vom Hero bis zur Visitenkarte.
Beispiel-Werte zur Demonstration der Anatomie. Auf der gebauten Seite steht hier keine Zahl ohne Beleg aus dem Kundenblatt — bis dahin nennt die Seite das Vorgehen statt des Ergebnisses.
| 1 | Ablesekante — 1 px, volle Modulbreite |
|---|---|
| 2 | Skalenmarke — 3 × 12 px, links auf der Kante |
| 3 | Kennwert — Space Grotesk 500, tnum, −0.02 em |
| 4 | Einheit — Versal 12 px, +0.12 em |
| 5 | Herkunft — «Quelle: … · erhoben TT.MM.JJJJ» |
Verbote: nie im Fliesstext, nie mit Icon, nie mit Schatten, nie mehr als drei pro Bildschirmlänge, nie animiert hochzählend ohne Beleg.
Farb-System — gemessen, nicht gewählt
Alle Werte stammen wörtlich aus brand-measurements.json
vom 09.09.2026. Kein Hex auf dieser Seite ist frei gewählt.
Die Markenfarbe bleibt unangetastet:
--brand-primary #205f63 — die Logofarbe des Kunden — und
--brand-surface #f2f9fa stehen exakt so, wie die Messung sie nennt;
sie tragen 6.85:1 und 7.3:1 und brauchen keine Korrektur. Zu korrigieren war allein die
Grau-Familie: Der Palettenton #7c7c84 trug als Schrift auf #f2f9fa nur
3.88:1. Die Rolle --brand-secondary rückt deshalb eine Sprosse tiefer
auf derselben Leiter — auf #595960. Das ist keine andere Farbe, sondern dieselbe
Familie: Am Pixel ausgezählt ist die Wortmarke «Energiehaus» im Logo tatsächlich in
5a5c5d gezeichnet — #7c7c84 war der über Kantenglättung gemittelte Palettenwert.
Die Rolle rückt damit näher ans Logo. #7c7c84 bleibt unverändert als
--brand-secondary-9 im Token-Satz und wird nirgends eingesetzt.
| Verboten | Gemessen | Stattdessen |
|---|---|---|
| Weiss auf #70b3b7 | 2.38:1 | Beschriftung immer #122224 (6.89:1) |
| #70b3b7 auf hellem Grund | 2.23:1 | #205f63 oder #0a5054 |
| #7c7c84 als Fläche, Text oder Rahmen | 3.88:1 | Grau-Familie läuft nur als #595960 (6.52:1); #7c7c84 bleibt unverändert als secondary-9 stehen |
| Weiss auf #7c7c84 | 4.14:1 | Fläche ist #595960, dort trägt dasselbe Weiss 6.95:1 |
| #c9d0d0 als Text oder Knopfrand | 1.47:1 | Text #505c5d, Rand #6a7a7b (4.21:1) |
| #748486 als Text auf Hell | 3.66:1 | nur Linie auf Dunkel (3.57:1) |
| #205f63 als Fliesstext | 6.85:1 | Fliesstext ist immer #122224 |
Typografie
Abgeschnittene Rundungen und offene Ziffern für die Kennwerte, kühler 18-px-Fliesstext darunter. Nicht Manrope (zu weich), nicht Sora (zu breite Versalien).
Energieberatung heisst hier: erst messen, dann rechnen, dann empfehlen. Ich verkaufe keine Anlage und montiere nichts — deshalb kann ich dir auch sagen, wenn eine Photovoltaikanlage auf deinem Dach nicht die beste Reihenfolge ist. Manchmal ist der günstigere Tarif der erste Schritt und das Dach der dritte. Das steht dann so im Blatt.
0175 9585675 · 09111 Chemnitz · 1.240 kWh · 9,8 kWp · 04.09.2026
Bildunterschrift: Zählerkasten im Keller, Chemnitz-Kappel.
Quelle: PVGIS-Ertragsrechnung · erhoben 04.09.2026
kWh im Jahr
Bauteile · Radius 0 · Höhe 62 px
Fahre mit der Maus darüber und drücke sie — Hover, Press und Fokus sind hier echt. Tab-Taste zeigt den Fokusring.
Bauteile auf dem Messgerät-Grund
Die Beschriftung des gefüllten Türkis-Knopfs ist immer #122224 — Weiss darauf wäre 2.38:1 und ist verboten.
| Vordergrund | Ratio | Rolle |
|---|---|---|
| #f2f9fa | 13.06:1 | Fliesstext, Display |
| #d9eced | 11.38:1 | Kleintext, Herkunftszeile |
| #a8d3d6 | 8.58:1 | Label, Link |
| #70b3b7 | 5.84:1 | Skalenmarke, Fokusring, CTA-Fläche |
| #748486 | 3.57:1 | nur 1-px-Linie (Nicht-Text, ≥ 3:1) |
Bauteile
Es gibt keine Karte mit eigener Hintergrundfarbe. Eine Zelle ist berandet, nie gefüllt — die Übersetzung der offenen Logo-Kontur.
Dachfläche, Neigung, Ausrichtung, Verschattung — und was am Ende davon in deinen Zähler läuft.
Damit ich das Dach im Solardachkataster nachsehen kann.
Bitte trag noch ein, wie ich dich erreiche — Telefon oder E-Mail, was dir lieber ist.
Layout
In-Gruppe : zwischen-Gruppen : Sektionen = 8 : 24 : 72 = 1 : 3 : 9. Andere Abstände existieren im Projekt nicht.
--space-1 · 8 px · Label → Wert, Icon → Text
--space-2 · 12 px · Headline → Lead
--space-3 · 24 px · zwischen Gruppen
--space-4 · 40 px · grosse Gruppen-Trennung
--space-5 · 72 px · zwischen Sektionen
--space-6 · 112 px · Kapitel-Atempause, max. 2× pro Seite
Bildsprache
Bedecktes Nordlicht oder tiefstehendes Streiflicht, entsättigt, Tiefen ins Petrol, Radius 0, kein Schatten. Keine lächelnden Familien, keine Sonne in Händen, keine Windräder.
Moodboard nach BILDREZEPT, Sektion 10 der DESIGN.md. Seitenverhältnis 2.4:1 (Desktop) / 4:5 (mobil), ohne Rahmen, ohne Schatten.
Sprache & Ton
Jonny Scholz ist eine Person, kein Betrieb mit Empfang. Wer jemanden an seinen Zählerkasten lässt, wird geduzt — aber vom Fachmann am Küchentisch, nicht vom Kumpel. Und es gibt kein Team: ein erfundenes «wir» wäre die erste Unwahrheit auf einer Seite, die von jeder Zahl Herkunft verlangt.
Ton: sachlich, nahbar, nüchtern, gerade heraus.
maßgeschneidert · individuell · passgenau · Rundum-sorglos-Paket · alles aus einer Hand · nachhaltig · grüne Zukunft · innovativ · modernste Technik · Premium · Sie/Ihr · wir