Apple
एक निळे स्विच असलेली पांढरी खोली
ॲपलची रचना संयमाचा एक आदर्श नमुना आहे: जवळजवळ पांढरा कॅनव्हास, भरपूर मोकळी जागा आणि एकच, तेजस्वी निळा रंग, ज्यामुळे प्रत्येक कृती हेतुपुरस्सर वाटते. मुख्य लक्ष टायपोग्राफीवर आहे—एसएफ प्रो (SF Pro), ज्यात अक्षरांमधील अंतर आकारानुसार कमी होत जाते, ज्यामुळे मथळ्यांना जास्त जड न वाटता एक वास्तुशिल्पीय स्पष्टता मिळते. उत्पादन हेच रचना आहे: उत्पादनाचे मोठे फोटो आणि जीवनशैलीची चित्रे प्रामुख्याने दिसतात, तर क्रोमचे घटक पातळ फ्रेम्स, अर्धपारदर्शक नेव्हिगेशन आणि सूक्ष्म रेषांमध्ये विलीन होतात. हलक्या राखाडी पार्श्वभूमीवर विभाग आणि प्रचारात्मक साहित्यासाठी पूर्ण-रंगीत ब्लॉक्स एकाआड एक येतात, ज्यामुळे सजावटीच्या घटकांऐवजी आकारातील बदलांद्वारे लय निर्माण होते.
पेज लेआउट हे पूर्ण-रुंदीचे पेज आहे, ज्यामध्ये कंटेनरची कोणतीही निश्चित कमाल रुंदी नाही—सेक्शन्स एका कडेपासून दुसऱ्या कडेपर्यंत पसरलेले आहेत, आणि त्यातील टेक्स्ट ब्लॉक्स अंदाजे ९८०px वर मध्यभागी ठेवलेले आहेत. नेव्हिगेशन ही एकच, निश्चित ग्लोबल बार आहे, ज्यामध्ये स्क्रोल केल्यावर दिसणाऱ्या प्रत्येक उत्पादनासाठी एक अतिरिक्त सबफोल्डर आहे. मुख्य लेआउट नेहमी मध्यभागी असतो: उत्पादनाचे मोठे नाव, एक-ओळीची टॅगलाइन, दोन पिल बटन्स, आणि त्यानंतर उर्वरित व्ह्यूपोर्ट व्यापणारी उत्पादनाची प्रतिमा. सेक्शन्स उभ्या दिशेने रचलेले आहेत, ज्यात एक चांगली उभी लय (सेक्शन्समध्ये ६४px+ पेक्षा जास्त अंतर) आहे, आणि #f5f5f7 व रंगीत बॅकग्राउंड्स एकाआड एक वापरलेले आहेत. पेजच्या तळाशी पूर्ण-रुंदीच्या सर्व्हिस कार्ड्सची (Apple TV+, Fitness+, Music, Arcade) एकच आडवी ओळ आहे, ज्यातील प्रत्येक कार्ड हा ओव्हरले टेक्स्ट आणि एका पिल बटणासह असलेला एक फोटो ब्लॉक आहे. यात कोणतेही साइडबार नाहीत, बहु-स्तंभीय मजकूर लेआउट नाहीत, किंवा कोणतीही असममित रचना नाही—सर्व काही मध्यभागी, रचलेले आणि सममित आहे.
फोटोग्राफी ही प्रमुख दृश्य भाषा आहे. उत्पादनांचे फोटो कोणत्याही संदर्भाशिवाय, पूर्णपणे पांढऱ्या किंवा फिकट राखाडी पार्श्वभूमीवर घेतले जातात—त्यात डिव्हाइस हेच मुख्य आकर्षण असते, जे वेगळे आणि प्रकाशित केलेले असते. जीवनशैलीचे फोटो पूर्ण-रुंदीच्या बॅनरमध्ये प्रदर्शित केले जातात, ज्यात अनेकदा वस्तू अगदी जवळून कापलेल्या (cropped) असतात. रंगांचे ग्रेडियंट्स (फिकट निळा, गुलाबी, हिरवा) हे उत्पादन विभागांसाठी पार्श्वभूमी म्हणून वापरले जातात, सजावट म्हणून नाही. आयकॉनोग्राफी किमान आणि रेषांवर आधारित आहे, १-२ पिक्सेल जाडीची असून, मजकुराप्रमाणेच त्याच ग्रेस्केलमध्ये आहे. उत्पादनांच्या फोटोंव्यतिरिक्त इतर कोणतीही चित्रे, अमूर्त ग्राफिक्स किंवा ३डी रेंडरिंग नाहीत.
पॅलेट
ब्रँड
- Apple Blue
#0071e3— भरलेली ॲक्शन बटणे, निवडलेल्या अवस्था - प्रत्येक दिसण्याला अर्थपूर्ण बनवण्यासाठी क्वचितच वापरलेला एकमेव इंटरॲक्टिव्ह क्रोमॅटिक रंग. - Link Blue
#0066cc— ठळक केलेल्या ॲक्शन बॉर्डर्स, एम्बेडेड लिंक्स - जिथे भरलेला टॅब्लेट खूप भडक दिसेल, तिथे ॲपल ब्लू पेक्षा अधिक गडद रंगाचा वापर केला आहे. - Signal Blue
#2997ff— सजावटीच्या चौकटी, चित्रांच्या बाह्यरेखा, आयकॉनच्या कडा - सिस्टीममधील सर्वात फिकट निळा रंग, जो वापरकर्त्याच्या परस्परसंवादाऐवजी वातावरण निर्मितीसाठी वापरला जातो.
तटस्थ
- Carbon
#1d1d1f— मुख्य मजकूर, शीर्षकांच्या कडा, नेव्हिगेशन रेषा, कार्डच्या कडा - यामध्ये शाईचा प्रमुख रंग जवळपास काळा असून त्यात उबदारपणाची किंचित छटा आहे. - Frost
#f5f5f7— पेज कॅनव्हास, मुख्य मजकुराची पार्श्वभूमी आणि फुटरचा पृष्ठभाग हे ॲपलच्या वैशिष्ट्यपूर्ण फिकट राखाडी रंगाचे आहेत, जो पूर्ण पांढऱ्या रंगापेक्षा किंचित अधिक सौम्य आहे. - Ice
#f4f8fb— भावपूर्ण पृष्ठभागावरील भरणा, सौम्य रंगछटा, गडद पार्श्वभूमीवरील बटणावरील मजकूर—एक सौम्य निळी छटा जी त्या भागाला उठून न दाखवता जिवंतपणा देते. - Smoke
#333333— दुय्यम मजकूर, नेव्हिगेशन फिल, बटण बॉर्डर्स - बॉर्डर्स आणि आयकॉन्ससाठी एक बहुउपयोगी न्यूट्रल रंग, ज्यांना मध्यम राखाडी रंगापेक्षा अधिक उठावदारपणाची गरज असते. - Graphite
#474747— नेव्हिगेशन मजकूर, नेव्हिगेशन बॉर्डर्स, लिंक बॉर्डर्स - एलिमेंट पदानुक्रमात कार्बन आणि स्मोक यांच्या दरम्यानचे स्थान व्यापतात. - Ash
#707070— फुटर मजकूर, सूचीच्या कडा, नॅव्हिगेशनच्या कडा, फिकट मुख्य मजकूर - जो मजकूर दिसणे आवश्यक आहे परंतु ठळक नसावा, अशा मजकुरासाठी मध्यम राखाडी रंग.
टायपोग्राफी
१२ ते ५६ पिक्सेल · ८ टप्पे
- SF Pro Display — बदली: Inter · रूपरेषा 400, 600, 700 · शीर्षके आणि मोठा मजकूर—40px+ आकार अरुंद ॲपर्चर आणि अधिक मजबूत निगेटिव्ह ट्रॅकिंगसाठी डिस्प्ले फॉरमॅट वापरतात; 700 जाहिरात लेआउटसाठी राखीव आहे, आणि 400 संपादकीय मजकुरातील उत्पादनांच्या नावासाठी आहे.
- SF Pro Text — बदली: Inter · रूपरेषा 300, 400, 600 · मुख्य मजकूर, नेव्हिगेशन, बटणे, उपशीर्षके — कार्यरत फॉन्ट; मुख्य मजकुरासाठी ४००, उपशीर्षके आणि क्वालिफाइड लेबल्ससाठी ३००, नेव्हिगेशन घटक आणि बटण मजकुरासाठी ६००; नकारात्मक अक्षर अंतर आकारानुसार प्रमाणात कमी होते (-०.०२२em ते १२px ते -०.०१em ते ४४px पर्यंत).
अंतर आणि स्वरूप
| उद्देश | अर्थ |
|---|---|
| घनता | सरासरी |
| मूलभूत पायरी | 12px |
| बटण त्रिज्या | 980px |
| कार्ड त्रिज्या | 8px |
| सावल्या | सावल्यांऐवजी सीमा नाहीत |
| विभागांच्या दरम्यान | 64px |
| पृष्ठाची रुंदी | 1440px |
एआय तुमची वेबसाईट Apple स्टाईलमध्ये तयार करेल आणि ती भरेल.
- लिंकद्वारे उत्पादने आणि पोस्ट्स भरा - Instagram, TikTok, Facebook.
- तुमच्या जुन्या साइटवरून सामग्री हस्तांतरित करा—फक्त पत्ता नमूद करा.
- सर्वोत्तम इंजिनवर आधुनिक डिझाइन: React ( Next.js) ज्यामध्ये सर्व्हर रेंडरिंग आणि एसईओ ऑप्टिमायझेशन अंगभूत आहेत.
- शोध परिणामांसाठी पूर्णपणे स्वयंचलित एसईओ ऑप्टिमायझेशन आणि न्यूरल नेटवर्क शिफारसी.
समान शैली
- Ui — मॅट पेपरवरील क्लिनिकल योजना
- ElevenLabs — उबदार क्रीम रंगांच्या छटा असलेला आणि सुस्पष्ट मथळे असलेला एक छायाचित्र-निबंध. बाऊहाउस-शैलीची एक वही—अंड्याच्या कवचाच्या रंगाचा कागद, काळी शाई, आणि उत्पादने प्रदर्शित करण्यासाठी जांभळ्या व नारंगी रंगाचा एकच ठळक वापर.
- monopo saigon — संपादकीय शांततेमागे एक तरल, इंद्रधनुषी चमक—वितळलेल्या प्रकाशावर तरंगणारी एक एकरंगी संपादकीय गॅलरी.
- Awesomic — कॉन्फेटीची आठवण करून देणाऱ्या नारंगी विरामचिन्हांसह संपादकीय झिंक जाळी
- Monad — उबदार चर्मपत्रावरील संपादकीय तांत्रिक नियतकालिक
- Dub — लिंकचे मॅट राईस पेपर कंट्रोल पॅनल
- Seline Analytics — गरम कागदावर एक शांत विश्लेषणात्मक टेबल
- Ventriloc — गरम कागदावरील डेटाची एक संपादकीय वेधशाळा - एक नारंगी निखारा जो एकरंगी अचूकतेला अधोरेखित करतो.
- Duolingo — पांढऱ्या कागदावर खेळकर वर्गाचा शुभंकर
- Stripe — धूसर काचेवर निळ्या शाईने लिहिलेले हिशोबाचे पुस्तक
- Notion — दुपारच्या उन्हात एक गरम कागदी वही
- Hyer Aviation — कॉकपिटमध्ये कागदावर पसरलेली संध्याकाळ. पहाटेचे फिकट आकाश विमानाच्या आकाराच्या सेरिफ लोगोला भिडते आणि एकच उबदार क्ले रंगाचा ठसा त्या एकरंगी संयमाला भंग करतो.