Huly
Βόρειο Σέλας στο Παρατηρητήριο Μεσονυχτίου - ο πρωταγωνιστής είναι μια κάθετη δέσμη μωβ που ξεθωριάζει σε κοράλλι, και κάθε ήσυχο τμήμα από κάτω δανείζεται την ίδια δίχρωμη ιστορία που αφηγείται σε πιο ήπιο τόνο.
Το Huly θυμίζει την ατμόσφαιρα ενός κοσμικού χώρου εργασίας: ένας σχεδόν μαύρος καμβάς με μια μοναδική βιολετί-κεχριμπαρένια λάμψη που διαπερνά το κύριο στοιχείο και από κάτω, ένα πιο απαλό πλέγμα για αυξημένη παραγωγικότητα. Το σύστημα λειτουργεί σε ένα στενό χρωματικό εύρος - ένα φωτεινό μπλε και ένα κοραλί κάνουν όλη την εργασία επωνυμίας σε επιφάνειες από γραφίτη σε στρώσεις, επομένως η σκοτεινή λειτουργία δεν δίνει ποτέ ουδέτερη αίσθηση. Η τυπογραφία είναι Inter-style για όλα τα λειτουργικά, με μια προσαρμοσμένη γραμματοσειρά (Esbuild) που προορίζεται για βασικά σημεία, με ύψος 80–84px και έντονη αρνητική απόσταση μεταξύ των γραμμάτων. Τα στοιχεία έχουν σχήμα κάψουλας: ακτίνα 9999px στα χειριστήρια, 12px στις κάρτες, ελάχιστη σκιά και λαμπερές γραμμές διαβάθμισης ως κύρια διακόσμηση. Η σελίδα εναλλάσσεται μεταξύ σκοτεινών περιοχών πλήρους σελίδας και ήρεμων φωτεινών τμημάτων, επομένως κάθε νέα οθόνη θα πρέπει να αποφασίσει για τη λειτουργία πριν επιλέξει χρώματα.
Η αρχική σελίδα πλήρους πλάτους διαθέτει μια κάθετη δέσμη του βόρειου σέλαος και έναν τίτλο με αριστερή ευθυγράμμιση, μαζί με ένα στιγμιότυπο οθόνης προϊόντος τοποθετημένο κάτω δεξιά. Κάτω από την αρχική σελίδα υπάρχει μια περιοχή περιεχομένου μέγιστου πλάτους, 1200px, με εναλλασσόμενες σκούρες και ανοιχτόχρωμες ρίγες. Κάθε ενότητα είναι ένα ενιαίο κάθετο μπλοκ: μια κεφαλίδα συν ένα πλέγμα 3 ή 4 στηλών από κάρτες που χωρίζονται από κενά 96px. Η ενότητα "MetaBrain" διαχωρίζει το πλέγμα με έναν κεντρικό τίτλο και ένα μωσαϊκό από κάρτες διαφόρων μεγεθών (μια μεγάλη κύρια κάρτα συν μικρότερες υποστηρικτικές κάρτες). Η σελίδα είναι γεμάτη περιεχόμενο, ακολουθώντας τα πρότυπα SaaS, αλλά χρησιμοποιεί εναλλασσόμενες σκούρες και ανοιχτόχρωμες ρίγες για να δώσει σε κάθε ενότητα χώρο να αναπνεύσει. Η πλοήγηση είναι μια ενιαία διαφανής επάνω γραμμή που σβήνει σε αδιαφανή καθώς κάνετε κύλιση.
Το κύριο στοιχείο είναι μια καθαρή διαβάθμιση του σέλαος, χωρίς φωτογραφίες. Όλες οι εικόνες είναι πραγματικά στιγμιότυπα οθόνης του περιβάλλοντος εργασίας χρήστη του προϊόντος (Kanban σε σκοτεινή λειτουργία, εισερχόμενα, ημερολόγιο), πλαισιωμένα σε πλαίσια καρτών που χρησιμεύουν τόσο ως αποδεικτικά στοιχεία όσο και ως διακόσμηση. Δεν υπάρχουν φωτογραφίες τρόπου ζωής, ούτε εικόνες αρχείου, ούτε τρισδιάστατες απεικονίσεις. Το μόνο οπτικό στοιχείο που δεν σχετίζεται με το περιβάλλον χρήστη είναι μια ζεστή, ακτινωτή λάμψη ηλιακής ακτινοβολίας στη βάση του σέλαος, που αποδίδεται ως διαβάθμιση CSS. Τα εικονίδια είναι μονόχρωμα εικονίδια γραμμής σε #95979 ή λευκό, ποτέ πολύχρωμα. Το σύστημα αντιμετωπίζει το δικό του σκοτεινό περιβάλλον χρήστη ως το κύριο στοιχείο—το προϊόν είναι οι φωτογραφίες.
Παλέτα
Μάρκα
- Electric Iris
#5683da— Το κύριο φόντο, η ένδειξη ενεργής πλοήγησης και η εντυπωσιακή πινελιά του Βόρειου Σέλαος —ένα έντονο βιολετί-μπλε χρώμα σε κατάμαυρο φόντο— δημιουργούν την εντύπωση περισσότερο συμμετοχής παρά εταιρικής δραστηριότητας. - Ember Pulse
#ff8964— Μια δευτερεύουσα πινελιά, μια ζεστή ζώνη του βόρειου σέλαος, ένα σημείο ειδοποίησης και ένα highlight στην εικονογράφηση—μια κεχριμπαρένια απόχρωση που σπάει τη νηφαλιότητα του μπλε και προσθέτει ζεστασιά στη δέσμη.
Ουδέτερος
- Obsidian Canvas
#303236— Το φόντο της σελίδας, η κυρίαρχη επιφάνεια, έχει σχεδόν μαύρο χρώμα με μια ελαφριά νότα ζεστασιάς, το τυπικό περιβάλλον για όλο το περιεχόμενο. - Void
#090a0c— Το βαθύτερο επιφανειακό στρώμα για διαβαθμίσεις στην κύρια οθόνη, modal φόντα και πλαίσια που θα πρέπει να ενσωματώνονται στον καμβά. - Charcoal Card
#111111— Υπερυψωμένες επιφάνειες από χαρτόνι και πάνελ, τοποθετημένες ένα βήμα πάνω από τον καμβά. - Slate Edge
#4a4b50— Λεπτά περιγράμματα και διαχωριστικά σε σκούρες επιφάνειες - Iron Veil
#6b6c6d— Αχνό φόντο για ετικέτες, γεμίσματα στοιχείων λίστας και απενεργοποιημένα γεμίσματα. - Smoke
#95979e— Τα περιγράμματα εικονιδίων, το πρόσθετο κείμενο και τα ανενεργά στοιχεία ελέγχου είναι το κύριο λειτουργικό στοιχείο σε μεσαίο γκρι χρώμα.
Τυπογραφία
από 11 έως 80px · 8 βήματα
- Inter — αντικατάσταση: DM Sans · περιγράμματα 300, 400, 500, 600, 700 · Όλο το λειτουργικό κείμενο στη διεπαφή χρήστη — κυρίως κείμενο, πλοήγηση, κουμπιά, στοιχεία λίστας, ετικέτες και μικρές επικεφαλίδες — χρησιμοποιείται με πάχος γραμματοσειράς 500–600 για έμφαση, 400 για το κυρίως κείμενο και 300 με φειδώ για διακριτικά μεταδεδομένα.
- Esbuild — αντικατάσταση: Sora · περιγράμματα 400, 500, 600 · Μόνο για εμφάνιση: τίτλοι εισαγωγής, επικεφαλίδες ενοτήτων και τίτλοι άρθρων MetaBrain. Η συμπυκνωμένη γεωμετρία και η μικρή απόσταση μεταξύ των γραμμάτων δημιουργούν την εντύπωση ότι τα 84px είναι πιο κατάλληλα για συντακτική εργασία από ό,τι για έργα SaaS. Ποτέ μην χρησιμοποιείτε κάτω από 28px.
Διαστήματα και μορφή
| Σκοπός | Εννοια |
|---|---|
| Πυκνότητα | ευρύχωρος |
| Βασικό βήμα | 12px |
| Ακτίνα κουμπιού | 9999px |
| Ακτίνα κάρτας | 12px |
| Σκιές | απαλές σκιές |
| Μεταξύ τμημάτων | 96px |
| Πλάτος σελίδας | 1200px |
Η Τεχνητή Νοημοσύνη θα δημιουργήσει τον ιστότοπό σας σε στυλ Huly και θα τον γεμίσει
- Συμπληρώστε με προϊόντα και αναρτήσεις μέσω του συνδέσμου - Instagram, TikTok, Facebook.
- Μεταφέρετε περιεχόμενο από τον παλιό σας ιστότοπο—απλώς καθορίστε τη διεύθυνση.
- Μοντέρνος σχεδιασμός στην καλύτερη μηχανή αναζήτησης: React ( Next.js) με απόδοση διακομιστή και βελτιστοποίηση SEO από την πρώτη στιγμή.
- Πλήρως αυτοματοποιημένη βελτιστοποίηση SEO για αποτελέσματα αναζήτησης και προτάσεις νευρωνικών δικτύων.
Παρόμοια στυλ
- monday — Λευκό εργαστήριο με παστέλ αυτοκόλλητα
- Slack — Η σκηνή είναι στο χρώμα της μελιτζάνας με λευκούς προβολείς. Μια βαθιά δαμασκηνί απόχρωση κυριαρχεί στις σκοτεινές περιοχές, ενώ ο υπόλευκος καμβάς επιτρέπει στους μεγάλους, πρωτοποριακούς τίτλους να αναπνέουν ελεύθερα.
- Base44 — Ηλιόλουστο σημειωματάριο με μαρκαδόρο lime
- Supahub — Απαλό φως ημέρας σε μια μωβ κορυφογραμμή. Ένας ως επί το πλείστον λευκός, ευάερος καμβάς φωτισμένος από έναν μόνο φωτεινό μωβ ήλιο, με διακοσμητικές ντεγκραντέ σφαίρες που χύνουν χρώμα στον αρνητικό χώρο και γενναιόδωρη στρογγυλεμένη γεωμετρία που προσδίδει σε κάθε επιφάνεια μια ευχάριστη, απτή βαρύτητα.
- Raycast — Κέντρο Διοίκησης Μεσονυχτίων, Coral Neon
- Dimension — ένας σταθμός εργασίας φωτισμένος από το σούρουπο με αδιαφανή γυάλινα πάνελ
- Wiza — Ένα παρατηρητήριο εξερεύνησης ορυκτών το σούρουπο, τυλιγμένο σε ομίχλη λεβάντας.
- Paste — Ένα κεχριμπαρένιο φανάρι σε λευκό μάρμαρο—το ζεστό ντεγκραντέ λογότυπο της μάρκας αιωρείται στον απέραντο λευκό χώρο, σαν το μόνο φωτισμένο παράθυρο σε ένα χιονισμένο κτίριο.
- Reworkd — Το απαλό φως της ημέρας στο διάγραμμα προϊόντος είναι το μόνο χρώμα που μιλάει από μόνο του, είναι το κουμπί δράσης και η επικεφαλίδα με διαβάθμιση από πάνω του.
- Reflect Notes — Ο χώρος Starry Violet είναι ένα σκοτεινό παρατηρητήριο όπου οι νότες αιωρούνται σαν αστερισμοί με φόντο ένα σχεδόν μαύρο λουλακί κενό.
- Ameba — Το δωμάτιο ελέγχου τα μεσάνυχτα – ένας ηλεκτρικός μπλε παλμός μέσα σε αδιαφανή γυάλινα πάνελ
- Todoist — Ένας ηλιόλουστος χώρος εργασίας με ένα χάρτινο ημερολόγιο – ένα ζεστό κρεμ γραφείο, σημειώσεις με μελάνι, ένα κόκκινο στυλό