Cursor
Ένα ζεστό εργαστήριο περγαμηνής, φωτισμένο από αναμμένα κάρβουνα
Το Cursor χρησιμοποιεί μια ζεστή, περγαμηνή τυπογραφία: έναν κρεμ καμβά, μαύρο κείμενο με μελάνι και μια μοναδική φλογερή πορτοκαλί πινελιά που ενεργοποιεί συνδέσμους και επιλογές αντί να γεμίζει κουμπιά. Οι επικεφαλίδες, που έχουν οριστεί στο CursorGothic σε βάρος 400, έχουν σταδιακά μειωμένη απόσταση μεταξύ των γραμμάτων καθώς αυξάνονται σε μέγεθος - η αυθεντία επιτυγχάνεται μέσω της συγκράτησης και του λεπτού βάρους των γραμμάτων αντί για την έντονη γραφή. Οι επιφάνειες διατηρούνται επίπεδες και σαν χαρτί, με λεπτά περιγράμματα και απαλές, ζεστές γκρι σκιές. Οι γωνίες παραμένουν καθαρές σε βάρος 4px σε όλο το κείμενο. Το EB Garamond χρησιμοποιείται επιλεκτικά για υποεπικεφαλίδες και πεζά κείμενα, ενώ το berkeleyMono χειρίζεται κώδικα, ετικέτες και μεταδεδομένα, δίνοντας στο σύστημα μια τυπογραφική προσωπικότητα που μοιάζει περισσότερο με λογοτεχνικό περιοδικό παρά με πίνακα ελέγχου SaaS.
Μέγιστο πλάτος: 1300px στο κέντρο, 24px περιθώριο. Επάνω πλοήγηση: Διαφανής κεφαλίδα ύψους 52px με λογότυπο και σημάδι κειμένου στα αριστερά, 4 κεντραρισμένοι σύνδεσμοι πλοήγησης, σύμπλεγμα "Σύνδεση / Επικοινωνία / Λήψη" ευθυγραμμισμένο προς τα δεξιά. Ήρωας: Κεφαλίδα ευθυγραμμισμένη αριστερά + διπλό μπλοκ παρότρυνσης για δράση με κείμενο που εκτείνεται από πάνω αριστερά και, στη συνέχεια, μια κάρτα μακέτας προϊόντος πλήρους πλάτους που εκτείνεται σε ολόκληρο το πλάτος της σελίδας. Λωρίδα εμπιστοσύνης: Μία οριζόντια σειρά 8 πλακιδίων λογότυπου σε μία γραμμή κατά μήκος του πλάτους της ενότητας. Οι ενότητες χαρακτηριστικών εναλλάσσουν κείμενο στα αριστερά και ένα στιγμιότυπο οθόνης στα δεξιά σε διάταξη δύο στηλών, 50/50 η καθεμία, με κάθετο ρυθμό 64-96px μεταξύ των ενοτήτων. Όλα τα στιγμιότυπα οθόνης χαρακτηριστικών είναι μακέτες παραθύρων με το ίδιο στυλ macOS. Υποσέλιδο: Πλέγμα τεσσάρων στηλών συνδέσμων με το σήμα της επωνυμίας στα αριστερά. Οι ενότητες χωρίζονται από άφθονο χώρο αναπνοής αντί για διαχωριστικά - ο ίδιος ο καμβάς σε κρεμ χρώμα παρέχει τον διαχωρισμό.
Τα στιγμιότυπα οθόνης του προϊόντος βρίσκονται στο επίκεντρο: μεγάλα μακέτα παραθύρων macOS που παρουσιάζουν το Cursor IDE σε δράση: καρτέλες αρχείων, προβολές διαφορών, σχέδια πρακτόρων, πίνακες τερματικών και ενσωμάτωση Slack/chat. Κάθε μακέτα παραθύρου πλαισιώνεται από μια κάρτα #f2f1ed με απαλή, ζεστή αντίθεση. Μια απαλή φωτογραφία τοπίου (βουνά/ορίζοντας ερήμου) εκτείνεται πέρα από το κύριο τμήμα, προσθέτοντας ζεστασιά χωρίς να ανταγωνίζεται το περιβάλλον χρήστη. Τα λογότυπα των πελατών ( Stripe, OpenAI, Linear, Datadog, NVIDIA, Figma, Ramp, Adobe) παρουσιάζονται ως μονόχρωμα γράμματα μέσα σε πλακίδια Linen σε σχήμα χαπιού. Δεν υπάρχουν φωτογραφίες ανθρώπων, εικόνες ή αφηρημένα διακοσμητικά γραφικά στοιχεία—όλο το οπτικό βάρος επικεντρώνεται στο περιβάλλον χρήστη και την επωνυμία του προϊόντος. Τα εικονίδια είναι λεπτά, μονογραμμικά σύμβολα γεμάτα με #7a7974 Ash, ποτέ χρωματικά.
Παλέτα
Ουδέτερος
- Ink
#26251e— Κύριο κείμενο, φόντο κουμπιού κύριας ενέργειας, κείμενο πλοήγησης - μια ζεστή, σχεδόν μαύρη απόχρωση, ποτέ καθαρό #000 - Parchment
#f7f7f4— Το φόντο της σελίδας, ο κύριος καμβάς, είναι μια ζεστή κρεμ απόχρωση που απαλύνει την αντίθεση και δημιουργεί την αίσθηση της εκτύπωσης με μελάνι αντί για την ψηφιακή εκτύπωση. - Bone
#f2f1ed— Οι επιφάνειες από χαρτόνι και τα υπερυψωμένα δοχεία, έναν τόνο πιο σκούρα από τον καμβά, δημιουργούν ένα πολυεπίπεδο, χωρίς περιθώρια εφέ «χαρτί σε χαρτί». - Linen
#e6e5e0— Ανοιχτό ουδέτερο γέμισμα για κουμπιά σε σκούρες επιφάνειες. - Stone
#cdcdc9— Λεπτά περιγράμματα, διαχωριστικά, διακριτικά χωρίσματα – γραμμές 1px σε ζεστούς τόνους - Mist
#a1a19f— Βοηθητικό κείμενο τρίτου επιπέδου, λεζάντες - μεταξύ του αθόρυβου και του δευτερεύοντος κειμένου.
Τυπογραφία
από 12 έως 72px · 6 βήματα
- CursorGothic — αντικατάσταση: Inter · περιγράμματα 400, 500 · Η κύρια γραμματοσειρά για τη διεπαφή χρήστη, τις επικεφαλίδες, την πλοήγηση, το κυρίως κείμενο και τον σχεδιασμό του προϊόντος. Οι επικεφαλίδες με πάχος 400 σημείων και σταδιακά μειούμενη απόσταση μεταξύ των γραμμάτων (-0,005em στα 22px → -0,03em στα 72px) αποτελούν ένα ιδιαίτερο χαρακτηριστικό της γραμματοσειράς: οι επικεφαλίδες δεν είναι ποτέ έντονη γραφή. Οι συναρτήσεις γραμματοσειράς ss08, ss09 και tnum ενεργοποιούν στυλιστικές εναλλακτικές και πίνακες.
- EB Garamond — αντικατάσταση: Iowan Old Style · περιγράμματα 400, 500 · Μια γραμματοσειρά serif για μεμονωμένες υποεπικεφαλίδες, κείμενο σώματος και δεδομένα σε μορφή πίνακα, η CursorGothic προσθέτει μια λογοτεχνική πινελιά στη διεπαφή.
- berkeleyMono — αντικατάσταση: ui-monospace · περιγράμματα 400, 500 · Monospace - για μπλοκ κώδικα, αποσπάσματα γραμμής εντολών, μεταδεδομένα, διαδρομές αρχείων και ετικέτες προγραμματιστή - μια τεχνική γλώσσα.
Διαστήματα και μορφή
| Σκοπός | Εννοια |
|---|---|
| Πυκνότητα | πυκνός |
| Βασικό βήμα | 8px |
| Ακτίνα κουμπιού | 4px |
| Ακτίνα κάρτας | 4px |
| Σκιές | χωρίς περιγράμματα αντί για σκιές |
| Μεταξύ τμημάτων | 64-96px |
| Πλάτος σελίδας | 1300px |
Η Τεχνητή Νοημοσύνη θα δημιουργήσει τον ιστότοπό σας σε στυλ Cursor και θα τον γεμίσει
- Συμπληρώστε με προϊόντα και αναρτήσεις μέσω του συνδέσμου - Instagram, TikTok, Facebook.
- Μεταφέρετε περιεχόμενο από τον παλιό σας ιστότοπο—απλώς καθορίστε τη διεύθυνση.
- Μοντέρνος σχεδιασμός στην καλύτερη μηχανή αναζήτησης: React ( Next.js) με απόδοση διακομιστή και βελτιστοποίηση SEO από την πρώτη στιγμή.
- Πλήρως αυτοματοποιημένη βελτιστοποίηση SEO για αποτελέσματα αναζήτησης και προτάσεις νευρωνικών δικτύων.
Παρόμοια στυλ
- Amplemarket — Ένας ηλιόλουστος χώρος εργασίας γεμάτος κομφετί
- Getharvest — Ένα γραφείο σε χρυσή ώρα – ένας ζεστός κρεμ καμβάς, λευκές καρτ ποστάλ κρεμασμένες στον καμβά και μια μόνο φωτεινή πορτοκαλί φλόγα
- Drive Capital — Ρετρό αφίσα οδικού ταξιδιού σε ζεστό χαρτί
- Wealthsimple — Αποθήκη με επένδυση κασμίρ και φωτισμό γκαλερί
- Huddle — Κάρτες απογραφής σε παστέλ χρώμα σε κρεμ χαρτί
- Fuser — Διάσπαρτες φωτογραφίες Polaroid στον τοίχο εργασίας ενός σχεδιαστή
- Campsite — Ένας ηλιόλουστος χώρος εργασίας ενός συντάκτη - ζεστό κρεμ χαρτί με μία μόνο πορτοκαλί σφραγίδα με έντονη γραφή
- Redis Agency — Το εκδοτικό εργαστήριο, ανοιχτό και μετά τις ώρες λειτουργίας, είναι ένας πίσσα σκοτεινός χώρος όπου όλη η δουλειά για το branding γίνεται με γραμματοσειρές serif και ένα μόνο κόκκινο ραπανάκι.
- AI Product Generation — Στούντιο φωτογραφίας σε λευκό χαρτί - τίτλος ως εξώφυλλο, πορτοκαλί χρώμα για επισήμανση της σύνταξης
- Getanchor — Ζεστή απόχρωση τερακότας σε κρεμ φόντο που έχει ξεθωριάσει από τον ήλιο
- Flatfile — Ένα ήσυχο ημερολόγιο δεδομένων σε ζεστή περγαμηνή
- Inthememory — Ένα αρχιτεκτονικό σχέδιο σε λευκό μάρμαρο με ένα μόνο ζεστό φως. Ένα ήσυχο, συντακτικό δωμάτιο δεδομένων όπου βαθύ τιρκουάζ μελάνι και χειριστήρια σε σχήμα χαπιού αιωρούνται πάνω από καθαρές λευκές επιφάνειες, διακοπτόμενα μόνο από μια πιτσιλιά πορτοκαλί.