Markenassets und Richtlinien
Nutze Assets und Richtlinien, um Cal.com auf allen Plattformen und Kontaktpunkten einheitlich darzustellen.
Logo
Das Cal.com-Logo sollte in allen Verweisen auf Cal.com verwendet werden, sofern der Platz es zulässt.
Für enge Layouts oder reine Logo-Raster ist das Cal.com-Icon eine kompakte Möglichkeit, auf Cal.com zu verweisen. Es dient auch als Favicon.
Wortmarke
Das Logo für jeden Verweis auf Cal.com, wenn der Platz es zulässt.
Icon
Für enge Layouts, Logo-Raster und das Favicon.
Farben
Die Cal.com-Farbpalette ist eine präzise Auswahl flacher Grautöne. Verwende diese Farben einheitlich in allen Markenmaterialien.
Klicke auf ein Farbfeld, um seinen Wert zu kopieren.
Typografie
Unsere primäre Schrift ist Cal Sans von Mark Davis. Sie ist eine geometrische Sans-Serif-Schrift für anspruchsvolle Anwendungsfälle. Auch aus der Nähe bleibt sie ansprechend, mit Buchstaben, die immer so aussehen, wie Nutzer es erwarten. Sie ist eine einzigartig warme Wahl für digitale Produkte und Fließtext. Sie bringt viel Schwung mit, wirkt aber trotzdem transparent, neutral und unaufdringlich.
Unsere Zweitschrift ist Cal Sans UI.
Gib im Schriftmuster deine eigenen Wörter ein.
- Display
- 80 px, 700
- Abschnittstitel
- 56 px, 700
- Einleitung
- 24 px, 500
- Fließtext
- 16 px, 400
- Beschriftung
- 12 px, 500
Ikonografie
Wir verwenden das Lucide-Icon-Set. Lucide ist ein Icon-Set mit 1.701 Icons.
UI-Icons haben eine einfache Linienform und drücken wesentliche Funktionen aus. Klicke auf ein Icon, um sein SVG zu kopieren.
43 icons
coss.com UI
Eine neue, moderne UI-Komponentenbibliothek auf Basis von Base UI. Die Bausteine für die Cal.com-Anwendung und die breitere coss.com-Plattform.
Accordion
Ein Satz einklappbarer Panels mit Überschriften und Inhalt.
Alert
Ein Hinweis zur Anzeige wichtiger Informationen.
Alert Dialog
Ein Dialog, der zum Fortfahren eine Reaktion erfordert.
Avatar
Ein Bildelement mit Fallback zur Darstellung eines Nutzers.
Badge
Ein Badge oder eine Komponente, die wie ein Badge aussieht.
Breadcrumb
Zeigt den Pfad zur aktuellen Ressource über eine Link-Hierarchie an.
Calendar
Eine Datumsauswahl-Komponente mit Unterstützung für Bereichs- und Mehrfachauswahl.
Tabs
Eine Komponente zum Wechseln zwischen verwandten Panels auf derselben Seite.
Toggle Group
Stellt einen gemeinsamen Zustand für eine Reihe von Umschalt-Buttons bereit.