Telegram, WhatsApp  +380637610482
Valery Danyuk
Valery DanyukEntwicklerEntwicklung von KI-Tools für Unternehmen. Hohe Qualität. Erschwinglich.In Telegram schreiben
Cursor — eine Vorschau einer Website in diesem Stil

Cursor

Eine gemütliche Pergamentwerkstatt, erleuchtet von glimmenden Kohlen

Cursor verwendet eine warme, pergamentartige Typografie: ein cremefarbener Hintergrund, tiefschwarzer Text und ein einzelner, leuchtend orangefarbener Akzent, der Links und Auswahlen aktiviert, anstatt Schaltflächen zu füllen. Überschriften, gesetzt in CursorGothic mit einer Strichstärke von 400, weisen mit zunehmender Größe einen stufenlos abnehmenden Buchstabenabstand auf – Autorität wird durch Zurückhaltung und dünne Schriftstärken statt durch Fettdruck erzielt. Die Oberflächen wirken flach und papierähnlich, mit dünnen Rändern und sanften, warmen Grautönen; die Ecken bleiben im gesamten Text mit einer Strichstärke von 4px scharf. EB Garamond wird gezielt für Unterüberschriften und Fließtext verwendet, während berkeleyMono Code, Tags und Metadaten verarbeitet. Dadurch erhält das System eine typografische Persönlichkeit, die eher an eine Literaturzeitschrift als an ein SaaS-Dashboard erinnert.

Maximale Breite: 1300 px zentriert, 24 px Rand. Top-Navigation: 52 px hoher, transparenter Header mit Logo und Textmarke links, 4 zentrierte Navigationslinks, „Anmelden / Kontakt / Download“-Bereich rechtsbündig. Hero: Linksbündiger Header + doppelter Call-to-Action-Block mit Text von links oben, gefolgt von einer Produkt-Mockup-Karte in voller Breite. Trust Stripe: Eine horizontale Reihe mit 8 Logo-Kacheln über die gesamte Breite des Abschnitts. Die Feature-Abschnitte zeigen abwechselnd links Text und rechts einen Screenshot in einem zweispaltigen Layout (jeweils 50/50) mit einem vertikalen Abstand von 64–96 px. Alle Feature-Screenshots sind Fenster-Mockups mit identischem macOS-Stil. Footer: Vierspaltiges Linkraster mit der Markenmarke links. Die Abschnitte sind durch großzügigen Freiraum getrennt – der cremefarbene Hintergrund selbst sorgt für die Trennung.

Die Produkt-Screenshots stehen im Mittelpunkt: Große macOS-Fenster-Mockups zeigen die Cursor IDE in Aktion: Datei-Tabs, Diff-Ansichten, Agentenpläne, Terminal-Panels und Slack-/Chat-Integration. Jedes Fenster-Mockup ist mit einer #f2f1-Karte in sanftem, warmem Kontrast eingefasst. Ein dezentes Landschaftsfoto (Berge/Wüstenhorizont) erstreckt sich über den Hauptbereich hinaus und verleiht ihm Wärme, ohne mit der Benutzeroberfläche zu konkurrieren. Kundenlogos ( Stripe, OpenAI, Linear, Datadog, NVIDIA, Figma, Ramp, Adobe) werden als monochrome Schriftzüge in pillenförmigen Linen-Kacheln präsentiert. Es gibt keine Fotos von Personen, Illustrationen oder abstrakte dekorative Grafikelemente – der gesamte visuelle Fokus liegt auf der Benutzeroberfläche und dem Branding des Produkts. Die Icons sind dünne, einfarbige Glyphen, gefüllt mit #7a7974 Ash, niemals farbig.

Palette

Neutral

  • Ink #26251e — Primärer Text, Hintergrund der primären Aktionsschaltfläche, Navigationstext – ein warmer, fast schwarzer Farbton, niemals reines #000
  • Parchment #f7f7f4 — Der Seitenhintergrund, die Hauptleinwand, ist in einem warmen Cremeton gehalten, der den Kontrast abmildert und eher an Tintenstrahldruck als an Digitaldruck erinnert.
  • Bone #f2f1ed — Die Oberflächen aus Karton und die erhabenen Behälter, die einen Ton dunkler als die Leinwand sind, erzeugen einen geschichteten, randlosen „Papier-auf-Papier“-Effekt.
  • Linen #e6e5e0 — Helle, neutrale Füllfarbe für Knöpfe auf dunklen Oberflächen.
  • Stone #cdcdc9 — Dünne Ränder, Trennlinien, dezente Unterteilungen – 1-Pixel-Linien in warmen Farbtönen
  • Mist #a1a19f — Hilfstext der dritten Ebene, Bildunterschriften – zwischen dem stummgeschalteten und dem sekundären Text.

Typografie

von 12 auf 72 Pixel · 6 Schritte

  • CursorGothic — Ersatz: Inter · Umrisse 400, 500 · Die primäre Schriftart für Benutzeroberfläche, Überschriften, Navigation, Fließtext und Produktdesign. Überschriften mit einer Strichstärke von 400 Punkt und stufenlos abnehmendem Buchstabenabstand (-0,005em bei 22px → -0,03em bei 72px) sind ein charakteristisches Merkmal dieser Schriftart: Überschriften werden nie fett dargestellt. Die Schriftfunktionen ss08, ss09 und tnum aktivieren stilistische Alternativen und Tabellenziffern.
  • EB Garamond — Ersatz: Iowan Old Style · Umrisse 400, 500 · CursorGothic ist eine redaktionelle Serifenschrift für einzelne Unterüberschriften, Fließtext und Tabellendaten und verleiht der Benutzeroberfläche eine literarische Note.
  • berkeleyMono — Ersatz: ui-monospace · Umrisse 400, 500 · Monospace – für Codeblöcke, Befehlszeilenausschnitte, Metadaten, Dateipfade und Entwicklerbezeichnungen – eine technische Sprache.

Intervalle und Form

ZweckBedeutung
Dichtedicht
Grundlegender Schritt8px
Radius der Schaltfläche4px
Kartenradius4px
SchattenNein – Ränder statt Schatten
Zwischen den Abschnitten64-96px
Seitenbreite1300px

KI erstellt Ihre Website im Cursor -Stil und füllt sie aus.

  • Teile deine Produkte und Beiträge über den Link – Instagram, TikTok, Facebook.
  • Übertragen Sie Inhalte von Ihrer alten Website – geben Sie einfach die Adresse an.
  • Modernes Design auf der besten Plattform: React ( Next.js) mit serverseitigem Rendering und SEO-Optimierung direkt nach der Installation.
  • Vollautomatisierte SEO-Optimierung für Suchergebnisse und Empfehlungen durch neuronale Netze.

Ähnliche Stile

  • Amplemarket — Ein sonnendurchfluteter Arbeitsplatz, übersät mit Konfetti
  • Getharvest — Ein Schreibtisch in der goldenen Stunde – eine warme, cremefarbene Leinwand, weiße Postkarten daran und eine einzelne, hellorange Flamme
  • Drive Capital — Retro-Roadtrip-Poster auf warmem Papier
  • Wealthsimple — Lagerhalle mit Kaschmirfutter und Galeriebeleuchtung
  • Huddle — Pastellfarbene Inventarkarten auf cremefarbenem Papier
  • Fuser — Verstreute Polaroids an der Arbeitswand eines Designers
  • Campsite — Ein sonnendurchfluteter Redakteursarbeitsplatz – warmes cremefarbenes Papier mit einem einzelnen orangefarbenen Stempel.
  • Redis Agency — Die nach Feierabend geöffnete Redaktionswerkstatt ist ein stockdunkler Ort, an dem die gesamte Markengestaltung mit Serifenschriften und einem einzigen roten Rettich erfolgt.
  • AI Product Generation — Fotostudio für redaktionelle Zwecke auf weißem Papier – Titel als Deckblatt, orange Farbe für redaktionelle Hervorhebungen
  • Getanchor — Warmer Terrakotta-Ton auf sonnengebleichtem Creme-Hintergrund
  • Flatfile — Ein stilles Datentagebuch auf warmem Pergament
  • Inthememory — Eine Architekturzeichnung auf weißem Marmor, sanft beleuchtet von einer einzelnen warmen Lampe. Ein ruhiger Redaktionsraum, in dem tieftürkisfarbene Tinte und pillenförmige Bedienelemente über klaren weißen Oberflächen zu schweben scheinen, nur unterbrochen von einem einzigen orangefarbenen Farbtupfer.