Telegramă, WhatsApp+380637610482
Valeri Danyuk
Valeri DanyukdezvoltatorDezvoltarea de instrumente de inteligență artificială pentru companii. De înaltă calitate. La prețuri accesibile.Scrie pe Telegram
Cursor — o previzualizare a unui site în acest stil

Cursor

Un atelier de pergament confortabil, luminat de cărbuni fumegând

Cursor folosește o tipografie caldă, asemănătoare pergamentului: o pânză cremoasă, text negru ca cerneala și un singur accent portocaliu aprins care activează linkuri și selecții în loc să completeze butoane. Titlurile, setate în CursorGothic la o grosime de 400, au o spațiere a literelor care scade treptat pe măsură ce cresc în dimensiune - autoritatea se obține prin reținere și grosimi subțiri ale literelor, mai degrabă decât prin îndrăzneală. Suprafețele sunt menținute plate și asemănătoare hârtiei, cu margini subțiri și umbre gri, moi și calde; colțurile rămân clare la o grosime de 4px pe tot parcursul textului. EB Garamond este utilizat selectiv pentru subtitluri și proză, în timp ce berkeleyMono gestionează codul, etichetele și metadatele, oferind sistemului o personalitate tipografică ce seamănă mai mult cu o revistă literară decât cu un tablou de bord SaaS.

Lățime maximă: 1300px centrat, margine 24px. Navigare sus: Antet transparent cu înălțimea de 52px, cu siglă și marcaj text în stânga, 4 linkuri de navigare centrate, cluster „Autentificare / Contact / Descărcare” aliniat la dreapta. Element principal: Antet aliniat la stânga + bloc dublu de îndemn la acțiune cu text care pornește din stânga sus, apoi o machetă de produs pe toată lățimea paginii. Bandă de încredere: Un rând orizontal de 8 dale cu siglă, pe o singură linie, pe toată lățimea secțiunii. Secțiunile de caracteristici alternează text în stânga și o captură de ecran în dreapta, într-un aspect pe două coloane, fiecare 50/50, cu un ritm vertical de 64-96px între secțiuni. Toate capturile de ecran ale caracteristicilor sunt machete de ferestre cu stil macOS identic. Subsol: Grilă pe patru coloane de linkuri cu marca mărcii în stânga. Secțiunile sunt separate de spațiu amplu de respirație, mai degrabă decât de separatoare - pânza crem în sine asigură separarea.

Capturile de ecran ale produsului ocupă un loc central: machete mari de ferestre macOS care prezintă IDE-ul Cursor în acțiune: file de fișiere, vizualizări diferențiale, planuri ale agenților, panouri de terminal și integrare Slack/chat. Fiecare machetă de fereastră este încadrată cu un card #f2f1ed cu un contrast delicat și cald. O fotografie discretă a unui peisaj (munți/orizont deșertic) se extinde dincolo de secțiunea principală, adăugând căldură fără a concura cu interfața cu utilizatorul. Logo-urile clienților ( Stripe, OpenAI, Linear, Datadog, NVIDIA, Figma, Ramp, Adobe) sunt prezentate ca litere monocrome în cadrul unor dale Linen în formă de pilulă. Nu există fotografii cu persoane, ilustrații sau elemente grafice decorative abstracte - toată greutatea vizuală este concentrată pe interfața cu utilizatorul și brandingul produsului. Pictogramele sunt glife subțiri, monoliniare, umplute cu #7a7974 Ash, niciodată cromatice.

Paletă

Neutru

  • Ink #26251e — Text principal, fundalul butonului de acțiune principal, text de navigare - o nuanță caldă, aproape neagră, niciodată pură #000
  • Parchment #f7f7f4 — Fundalul paginii, pânza principală, este o nuanță caldă de crem care atenuează contrastul și creează senzația de imprimare cu cerneală, mai degrabă decât de imprimare digitală.
  • Bone #f2f1ed — Suprafețele de carton și recipientele în relief, cu un ton mai închise decât pânza, creează un efect de „hârtie pe hârtie” stratificat, fără chenar.
  • Linen #e6e5e0 — Umplutură neutră deschisă pentru nasturi pe suprafețe întunecate.
  • Stone #cdcdc9 — Borduri subțiri, separatoare, partiții subtile – linii de 1px în tonuri calde
  • Mist #a1a19f — Text auxiliar de nivel trei, subtitrări - între textul cu sunet dezactivat și cel secundar.

Tipografie

de la 12 la 72px · 6 pași

  • CursorGothic — înlocuire: Inter · contururi 400, 500 · Fontul principal pentru interfața utilizator, titluri, navigare, text și designul produsului. Titlurile cu o grosime de 400 de puncte și o spațiere între litere care scade treptat (-0,005em la 22px → -0,03em la 72px) reprezintă o caracteristică distinctivă a fontului: titlurile nu sunt niciodată îngroșate. Funcțiile fontului ss08, ss09 și tnum activează alternative stilistice și figuri tabelare.
  • EB Garamond — înlocuire: Iowan Old Style · contururi 400, 500 · CursorGothic, un font serif editorial pentru subtitluri individuale, text și date tabelare, adaugă o notă literară interfeței.
  • berkeleyMono — înlocuire: ui-monospace · contururi 400, 500 · Monospace - pentru blocuri de cod, fragmente de cod în linia de comandă, metadate, căi de fișiere și etichete pentru dezvoltatori - un limbaj tehnic.

Intervale și formă

ScopSens
Densitatedens
Pasul de bază8px
Raza butonului4px
Raza cardului4px
Umbrefără - margini în loc de umbre
Între secțiuni64-96px
Lățimea paginii1300px

Inteligența artificială vă va construi site-ul web în stilul Cursor și îl va completa

  • Completează cu produse și postări prin link - Instagram, TikTok, Facebook.
  • Transferați conținut de pe vechiul site - specificați doar adresa.
  • Design modern pe cel mai bun motor: React ( Next.js) cu randare pe server și optimizare SEO gata de utilizare.
  • Optimizare SEO complet automatizată pentru rezultatele căutării și recomandări de rețele neuronale.

Stiluri similare

  • Amplemarket — Un loc de muncă scăldat în soare, presărat cu confetti
  • Getharvest — Un birou la ora aurie – o pânză crem caldă, cărți poștale albe atârnate pe pânză și o singură flacără portocalie strălucitoare
  • Drive Capital — Afiș retro pentru călătorii rutiere pe hârtie caldă
  • Wealthsimple — Depozit căptușit cu cașmir și iluminat de galerie
  • Huddle — Fișe de inventar pastelate pe hârtie crem
  • Fuser — Polaroide împrăștiate pe peretele de lucru al unui designer
  • Campsite — Stația de lucru a unui editor însorită - hârtie crem caldă cu o singură ștampilă portocalie cu intenție
  • Redis Agency — Atelierul editorial, deschis după orele de program, este un loc întunecat ca smoala, unde toată munca de branding se face cu ajutorul fonturilor serif și al unei singure ridichi roșii.
  • AI Product Generation — Studio de fotografie editorială pe hârtie albă - titlu ca copertă, culoare portocalie pentru evidențierea editorială
  • Getanchor — Nuanță caldă de teracotă pe un fundal crem decolorat de soare
  • Flatfile — Un jurnal de date liniștit pe pergament cald
  • Inthememory — Un desen arhitectural pe marmură albă, cu o singură lumină caldă. O cameră de date editorială liniștită, unde cerneala turcoaz intens și comenzile în formă de pastilă plutesc deasupra unor suprafețe albe și impecabile, întrerupte doar de o singură pată de portocaliu.