Style-Guide-Notioneers

This is the Notioneers Style Guide

https://notioneerseunew.super.site/en/style-guide-notioneers

Section Backgrounds

GREY FG GRAY BG

Callout brown bg

Section Mist [GRAY Callout]

Wir unterstützen dein Team dabei, Zeit zu sparen, die Zusammenarbeit zu verbessern und sich auf das Wesentliche zu konzentrieren: euer Unternehmen.

GESPRÄCH VEREINBAREN

GREY FG GREEN BG

Callout green bg

Section Veil [GREEN Callout]

Wir unterstützen dein Team dabei, Zeit zu sparen, die Zusammenarbeit zu verbessern und sich auf das Wesentliche zu konzentrieren: euer Unternehmen.

GESPRÄCH VEREINBAREN

Callout brown bg

Section Depth [BROWN Callout] we use it as a CTA

Wir unterstützen dein Team dabei, Zeit zu sparen, die Zusammenarbeit zu verbessern und sich auf das Wesentliche zu konzentrieren: euer Unternehmen.

GESPRÄCH VEREINBAREN

Cards made with callouts

CALLOUTS

Callouts used in columns

Text Only 01 Default

Callout Blue

We put ourselves in your shoes. We customize solutions to meet your specific needs.

Callout Purple

We love what we do. That enthusiasm drives us to go above and beyond in helping your business thrive.

Callout Pink

We build trust through honest communication, transparency, and a genuine commitment to your goals.

With Icon Right 02 Icon Right

Callout Yellow

Icon is on top of the title and aligned right

Source: Notion

Callout Orange

Icon is on top of the title and aligned right

Source: IDC

Callout Red

Icon is on top of the title and aligned right

Source: Our Clients

With Icon white 03 Icon Right white

Verstreute Informationen

2 columns inside the callout, icon is in first column.

Endlose Vorlagen-Suche

2 columns inside the callout, icon is in first column.

Kommen dir diese Herausforderungen bekannt vor?

TAG FOR SECTION

Verstreute Informationen

Kennst du das Gefühl, ständig auf der Suche nach deinen Daten zu sein?

Auch wir haben uns früher durch einen digitalen Dschungel.

Endlose Vorlagen-Suche

Ganz ehrlich: Unzählige Vorlagen auszuprobieren, ist so ermüdend.

Wir haben früher selbst Tage nach der perfekten Notion-Vorlage gesucht.

Mangelnde Übersicht

Tappt ihr bei euren Projekten oft im Dunkeln - und hast keine Klarheit über ihren Fortschritt?

DIY-Dilemma

Träumst du auch davon, ein eigenes System zu erstellen - fühlst dich aber von der Flut der Tutorials überfordert?

Hints

Hints also full width but not rendered als Section Backgroundn Blog

Wichtig: Private Seiten werden auch gelöscht [RED CALLOUT]

Wenn du ein Mitglied aus einem Workspace entfernst, verliert diese Person sofort den Zugriff auf den Workspace. Seiten aus dem Abschnitt Privat in der Seitenleiste der entsprechenden Person werden in der Ansicht ausgeblendet.

Wenn du dieses Mitglied innerhalb von 30 Tagen zurück in den Workspace einlädst, werden die privaten Seiten wieder eingeblendet.

→ Nur beim Enterprise Plan können diese Seiten vom Admin migriert werden.

Info Article updated recently [YELLOW CALLOUT]

Wenn du dieses Mitglied innerhalb von 30 Tagen zurück in den Workspace einlädst, werden die privaten Seiten wieder eingeblendet.

→ Nur beim Enterprise Plan können diese Seiten vom Admin migriert werden.

How it works [transparent callout]

Step-by-step guide in Blog

Create a Date field with the label "Date of birth"
Create a Formula field
Copy the formula code from below into the formula field

Typefaces

These are the Notion Blocks:

Heading 1 with green text (300)

Heading 2 with green text (300)

Heading 3 with green text (400)

Normal text (300)

This is bold text (600)

this is grey text

This is a bold text within a normal text

This is a Textlink

This is a Textlink within a text

This is a Italic Text

This is a italic and bold text

This is a numbered list

First item
second item
third item

This is a bullet points list

bullet point 1
bullet point 2
bullet point 3

This is notion todo

to-do 1

to-do 2

to-do 3

This is notion todo

✓ Checked 1

✓ Checked 2

✓ Checked 3

Buttons

We have the following button styles

Depth

Pulse

Sage

Transparent

Special Sections

Wie wir eure Transformation begleiten

UNSER PROZESS

01 Verstehen & Einrichten

Wir nehmen uns in der Notion-Beratung Zeit, eure Herausforderungen wirklich zu begreifen.

Dann richten wir das Notioneers OS ein: euer System für Klarheit, Effizienz und gute Zusammenarbeit.

02 Gestalten & Umsetzen

Wir bauen euer Notion-System gemeinsam mit internen Super-Nutzern auf.

Wir migrieren Daten, legen Zugriffsrechte fest und stellen sicher, dass alles nahtlos in eure Arbeitsabläufe passt.

03 Unterstützen & Wissen vermitteln

Wir zeigen deinem Team in Notion-Schulungen, wie das Tool ihren Alltag erleichtert.

Wir sorgen dafür, dass das Fachwissen im Unternehmen ankommt - und der Wandel nachhaltig ist.

ENTDECKE DEN GANZEN PROZESS

Tags inside more then 2 Columns

TAG INSIDE 2 COLUMNs

PHASE 01

Verstehen

Wir analysieren eure Situation und entwickeln daraus eine massgeschneiderte Strategie.

PHASE 02

Bauen

Gemeinsam mit ausgewählten Super-Usern entwickeln, testen und verfeinern wir das System, bis es sitzt.

PHASE 03

Einführen

Euer Team wird geschult und startet mit der Arbeit im neuen System. Wir sorgen dafür, dass alle an Bord sind.

ONGOING

Support

Mit Anleitungen und Hilfe unterstützen wir euch weiterhin, bis die neuen Workflows reibungslos laufen.

FAQ (Toggles)

‣

Why should I book a call with you?

‣

Toggle with grey background

‣

Toggle with green background

Other UI Elements

Tabbed Nav

Name
2

Random reference of all callouts

No Background - Default

Dies ist ein Beispieltext im Standard-Callout ohne Hintergrundfarbe.

Gray Background

Dies ist ein Beispieltext im Callout mit grauem Hintergrund.

Green Background

Dies ist ein Beispieltext im Callout mit grünem Hintergrund.

Brown Background

Dies ist ein Beispieltext im Callout mit braunem Hintergrund.

Orange Background

Dies ist ein Beispieltext im Callout mit orangem Hintergrund.

Yellow Background

Dies ist ein Beispieltext im Callout mit gelbem Hintergrund.

Blue Background

Dies ist ein Beispieltext im Callout mit blauem Hintergrund.

Purple Background

Dies ist ein Beispieltext im Callout mit violettem Hintergrund.

Pink Background

Dies ist ein Beispieltext im Callout mit rosafarbenem Hintergrund.

Red Background

Dies ist ein Beispieltext im Callout mit rotem Hintergrund.

all in columns ⬇️

No Background

Dies ist ein Beispieltext im Standard-Callout ohne Hintergrundfarbe.

Green Background

Dies ist ein Beispieltext im Callout mit grünem Hintergrund.

Gray Background

Dies ist ein Beispieltext im Callout mit grauem Hintergrund.

Blue Background

Dies ist ein Beispieltext im Callout mit blauem Hintergrund.

Brown Background

Dies ist ein Beispieltext im Callout mit braunem Hintergrund.

Orange Background

Dies ist ein Beispieltext im Callout mit orangem Hintergrund.

Yellow Background

Dies ist ein Beispieltext im Callout mit gelbem Hintergrund.

Purple Background

Dies ist ein Beispieltext im Callout mit violettem Hintergrund.

Pink Background

Dies ist ein Beispieltext im Callout mit rosafarbenem Hintergrund.

Red Background

Dies ist ein Beispieltext im Callout mit rotem Hintergrund.

Footer

Keep up with the latest Notion business trends.

Subscribe to receive tips, templates and updates directly to your inbox.

BG	BG	FG	Notion Color BG/FG	Code
Tags
	Halo	Stone	GRAY / GRAY	`HALO STONE`
	Mist	Stone	GREEN / GRAY	`MIST STONE`
	Depth	Bloom	BROWN / GREEN	`DEPTH BLOOM`
Code Format
	#E5E5E5	Root		`Code format NO Formating`
	#E5E5E5	Root	-	`Code DEFAULT TEXT`	we don’t use this anymore
	#E5E5E5	Root		`Code format Green text`	we don’t use this anymore
Not really
	Aeris Light	Aeris Bold	Blue	`Aeris`
	Nimbus Light	Nimbus Bold	Purple	`Nimbus`
	Muse Light	Muse Bold	Pink	`Muse`
	Solea Light	Solea Bold	SYellow	`Solea`
	Cove Light	Cove Bold	Orange	`Cove`
	Coral Light	Coral Bold	Red	`Coral`