Caldera

Παλέτα

Μάρκα

• Ember #fc5000 — Τα κύρια κουμπιά δράσης, οι κάρτες στατιστικών και οι βασικές οπτικές πινελιές είναι η μόνη επιθετική χρωματική πινελιά. Ο πλούτος της σε αντίθεση με τους ζεστούς γκρι τόνους δημιουργεί μια αίσθηση επείγοντος χωρίς την ανάγκη για πρόσθετα διακοσμητικά στοιχεία.
• Plasma Violet #524ae9 — Κύρια βάση ημιτονικής διαβάθμισης, μία επιπλέον επιφάνεια κάρτας - Χρησιμοποιείται σχεδόν αποκλειστικά στο κύριο μοτίβο κουκκίδων και σε μία ειδική κάρτα. Δεν χρησιμοποιείται ποτέ για χειριστήρια.

Ουδέτερος

• Sulfur #f5f28e — Το φόντο για τα εικονίδια ετικετών και κατηγοριών, μικρές επισημάνσεις, είναι ένα απαλό κίτρινο χρώμα που χρησιμοποιείται για να υποδείξει κατηγορίες αναρτήσεων ιστολογίου και ανακοινώσεις προγραμμάτων.
• Limestone #f7f6f2 — Οι επιφάνειες των καρτών, τα φόντα των μπλοκ περιεχομένου και τα πρόσθετα γεμίσματα κουμπιών έχουν μια πιο ανοιχτή, πιο ζεστή απόχρωση του λευκού που κάνει τα στοιχεία να ξεχωρίζουν στον καμβά της σελίδας.
• Pumice #e2e2df — Το κύριο φόντο της σελίδας είναι ένα ζεστό μεσαίο γκρι που χρησιμεύει ως βάση για κάθε ενότητα. Είναι ελαφρώς πιο σκούρο από την επιφάνεια του χαρτονιού, επιτρέποντας έναν διακριτικό διαχωρισμό της μορφής και του φόντου χωρίς σκιές.
• Obsidian #070607 — Το κύριο κείμενο, οι επικεφαλίδες, το κείμενο των συνδέσμων και τα πλαίσια των κουμπιών είναι σχεδόν μαύρα με μια μόλις αισθητή ζεστή απόχρωση που ταιριάζει με τα ζεστά χρώματα του καμβά.
• Chalk #ffffff — Κείμενο σε σκούρα τμήματα, εισαγωγή κειμένου σε σκούρα φόντα, επικαλύψεις υψηλής αντίθεσης - Το καθαρό λευκό χρησιμοποιείται μόνο όπου απαιτείται μέγιστη αντίθεση με σκούρες επιφάνειες.

Τυπογραφία

από 12 έως 189px · 10 βήματα

• PP Neue Corp Compact — αντικατάσταση: Bebas Neue · περιγράμματα 400 (Ultrabold cut) · Όλες οι επικεφαλίδες και το κείμενο εμφάνισης. Μια ειδικά σχεδιασμένη, συμπυκνωμένη, εξαιρετικά έντονη γραμματοσειρά προσδίδει στις επικεφαλίδες ένα βιομηχανικό, βαρύ στυλ που θυμίζει πινακίδα. Το μέγεθος των 189px στο κύριο μπλοκ αντικατοπτρίζει το χαρακτηριστικό στυλ της μάρκας: συμπυκνωμένο, σχεδόν δομικό παρά τυπογραφικό. Οι ρυθμίσεις "ss06" και "ss10" ενεργοποιούν εναλλακτικές μορφές γραμμάτων και απόστασης για έναν πιο επιθετικό, συμπυκνωμένο ρυθμό. Η θετική απόσταση μεταξύ των γραμμάτων (+0,02em) είναι ασυνήθιστη για μεγέθη οθόνης και αποτρέπει την αίσθηση περιορισμένου κειμένου στα 80–189px.
• DM Sans — αντικατάσταση: Inter · περιγράμματα 500 (Medium only — never Regular or Bold) · Το κύριο κείμενο, οι σύνδεσμοι πλοήγησης, οι ετικέτες κουμπιών και οι δευτερεύουσες επικεφαλίδες έχουν μέγεθος έως 30px. Το μεσαίο βάρος γραμματοσειράς επιλέχθηκε σκόπιμα—η κανονική θα φαινόταν πολύ λεπτή σε σχέση με την εξαιρετικά έντονη γραμματοσειρά επικεφαλίδας, ενώ η έντονη γραφή θα την ανταγωνιζόταν. Το DM Sans δημιουργεί ένα ανθρωπιστικό, ελαφρώς γεωμετρικό αντίστιγμα στη βιομηχανική γραμματοσειρά επικεφαλίδας.
• System sans-serif — αντικατάσταση: Inter · περιγράμματα 400 · Λεζάντες, μετακείμενο, ημερομηνίες, μικροετικέτες. Χρησιμοποιούνται μόνο σε 12px, όπου το βάρος και η αναγνωρισιμότητα της επωνυμίας είναι λιγότερο σημαντικά από την εξοικονόμηση μεγέθους.

Διαστήματα και μορφή

Παρόμοια στυλ

• teenage engineering — Βιομηχανικός κατάλογος φωτισμού στούντιο - το προϊόν είναι το μόνο σημαντικό αντικείμενο στη σελίδα και όλα τα άλλα συζητούνται γύρω από αυτό
• basement — Ένα άδειο τυπογραφείο στις 3 π.μ. – τεράστιες, συμπιεσμένες γραμματοσειρές να απλώνονται στο σκοτάδι, μια μοναδική πορτοκαλί λάμψη στη γραμμή πλοήγησης, όλα τα άλλα λευκά ή γκρίζα.
• amra — Μια ιριδίζουσα σφαίρα σε λευκό φόντο—η έμφαση στη λεβάντα είναι ο μόνος χρωματικός παλμός σε μια σχεδόν τέλεια αχρωματική σελίδα, και η σφαίρα μονής διαβάθμισης κάνει τη δουλειά που κάνει συνήθως η κύρια εικόνα.
• Stink Studios — Ένα κινηματογραφικό στούντιο τα μεσάνυχτα - ο προβολέας βουίζει, το δωμάτιο είναι σκοτεινό, μόνο η ταινία είναι αναμμένη
• Andrei Rybin — Ένα μονόχρωμο μπλοκ σχεδίασης είναι ένα σημειωματάριο σχεδιαστή στο οποίο οθόνες τηλεφώνου είναι προσαρτημένες σε έναν λευκό τοίχο σαν φύλλα επαφής.
• Uniswap Cup — Η μετάδοση του διαγωνισμού eSports λαμβάνει χώρα σε μια ιστοσελίδα μακέτας - ένας ροζ μαρκαδόρος σκιαγραφεί ένα πλέγμα από λευκά τετράγωνα και λεπτές γραμμές
• Freytag Anderson — Η αυλαία του κινηματογράφου σηκώνεται με μία μόνο λέξη. Μια τεράστια κινούμενη εικόνα καταλαμβάνει ολόκληρη την οθόνη, το όνομα της μάρκας κάθεται στη γωνία σαν τίτλος και τίποτα άλλο δεν αποσπά την προσοχή.
• Integrated Biosciences — εργαστήριο βιοφωταύγειας τα μεσάνυχτα
• Vercel — Τερματικό τυπωμένο σε λευκό χαρτί
• Mintlify — Ένας κήπος με σύννεφα πάνω από ένα γυάλινο τραπέζι. Ο χειρόγραφος ουρανός και το ντοκιμαντέρ πλαισιώνονται μαζί—το μόνο μέρος όπου το χρώμα και η έννοια συγκρούονται προτού η σελίδα ξεθωριάσει στο μοναστικό λευκό.
• Gleap — Ένας χώρος εργασίας διακοσμημένος σε ζεστές κρεμ αποχρώσεις με γραφιτικές πινελιές—ένα στούντιο όπου οι ματ μαύρες κουκκίδες μελανιού φαίνεται να αιωρούνται πάνω από την αρχιτεκτονική από λινό.
• ClickUp — Ένας ισχυρός πίνακας ελέγχου σε λευκό μάρμαρο. Η σελίδα είναι ένα φυλλάδιο προϊόντος για ένα εργαλείο παραγωγικότητας, επομένως η οπτική γλώσσα δανείζεται από το ίδιο το προϊόν: πυκνές λίστες, δείκτες κατάστασης, ομάδες avatar και έντονες τυπογραφικές δηλώσεις που μοιάζουν με προδιαγραφές προϊόντος στην οθόνη.