Stripe

फ्रोस्टेड गिलासमा नील मसीले लेखिएको खाता पुस्तिका

Stripe वित्तीय उपकरणहरूको लागि लगभग मोनोक्रोम भाषा प्रयोग गर्दछ: गाढा नीलो शीर्षकहरू भएको नरम, शीतल सेतो क्यानभास, लगभग कुनै सजावटी क्रोम तत्वहरू छैनन्, र एकल चम्किलो इन्डिगो (#533afd) जुन वैध रूपमा बटन, लिङ्क, वा आइकन रूपरेखाको रूपमा प्रयोग गर्न सकिन्छ। टाइपोग्राफी असाधारण रूपमा पातलो छ, 300-पोइन्ट वजनको साथ - 56px मा पनि - जुन स्पष्ट रूपमा कर्पोरेट भन्दा आत्मविश्वासपूर्वक कम देखिन्छ; अक्षर स्पेसिङ बढ्दो आकारको साथ तीव्र रूपमा घट्छ। बटनहरू सानो, वर्ग (4px) छन्, र बैजनी भरणहरू वा सबैभन्दा पातलो बैजनी रूपरेखाहरू प्रयोग गर्छन्। प्रणालीले छायाँलाई पूर्ण रूपमा बेवास्ता गर्दछ; उचाइ मार्फत भन्दा पृष्ठभूमि रंगहरू (सेतो → #f8fafd → #e5edf5 → बैजनी रंगहरू) परिवर्तन गरेर गहिराई प्राप्त गरिन्छ। सम्पूर्ण इन्टरफेसले लेखा खाता वा टर्मिनल जस्तै व्यवहार गर्दछ: घना जानकारी, स्पष्ट रेखाहरू, खण्डहरू बीच पर्याप्त ठाउँ, र रंग कार्य आवश्यक हुँदा मात्र देखा पर्दछ।

सेतो क्यानभासमा केन्द्रित सामग्री स्तम्भको लागि अधिकतम चौडाइ ~१३२० पिक्सेल हो। हिरो पूर्ण आकार (५६ पिक्सेल) मा बायाँ-पङ्क्तिबद्ध पाठ ब्लक हो जसमा तल दुई कल टु एक्शन हुन्छ, कुनै हिरो छवि छैन - टाइपोग्राफी नै हिरो हो। खण्डहरू बराबर ९६ पिक्सेल गटर र १ पिक्सेल #e5edf5 डिभाइडरहरूसँग ठाडो रूपमा व्यवस्थित छन्; त्यहाँ कुनै वैकल्पिक गाढा/हल्का स्ट्रिपहरू छैनन्। प्रत्येक खण्डले दोहोरिने ढाँचा पछ्याउँछ: सबै क्याप्समा सानो खण्ड शीर्षक (धुवाँदार रंग, १२ पिक्सेल), त्यसपछि ३२-४८ पिक्सेल हेडिङ, त्यसपछि २२ पिक्सेल अनुच्छेद, त्यसपछि उत्पादन कार्डहरूको ग्रिड (डेस्कटपमा ३ स्तम्भहरू) वा दृश्य कलाको साथ २-स्तम्भ पाठ ब्लक। क्लाइन्ट लोगोहरू बायाँ-पङ्क्तिबद्ध, साँघुरो ठाडो स्ट्रिपमा देखा पर्दछन्। फुटर लिङ्कहरूको बहु-स्तम्भ सूचीहरू भएको एउटा चौडा #f8fafd स्ट्रिप हो। समग्र लय ढिलो, मापन गरिएको, र मुख्यतया पाठ्य छ - लामो स्क्रोल लम्बाइको बावजुद जानकारी घनत्व कम छ।

इमेजरी संयमित र वृत्तचित्र-शैलीको छ। पूर्ण-पृष्ठका तस्बिरहरू केवल केस स्टडीहरू (जस्तै, हर्ट्जको लागि हवाई ट्राफिक फोटोग्राफी) प्रस्तुत गर्ने खण्डहरूमा मात्र देखा पर्दछन्, माथिबाट वा नाटकीय कोणहरूमा खिचिएका, प्राकृतिक रङहरू प्रयोग गरेर - कुनै डुओटोन वा रङ प्रशोधन छैन। उत्पादनको प्रयोगकर्ता इन्टरफेसको स्क्रिनसटहरू फिचर कार्डहरू भित्र प्रयोग गरिन्छ, तीखा कोणहरू र स्पष्ट किनाराहरूसँग रेन्डर गरिन्छ, उपकरण फ्रेमहरू बिना। साझेदार लोगोहरू कुनै कन्टेनरहरू बिना, तिनीहरूको आफ्नै रङहरूमा प्रदर्शित हुन्छन्। त्यहाँ कुनै चित्रण, 3D रेन्डरहरू, वा सजावटी अमूर्त ग्राफिक तत्वहरू छैनन्। आइकनहरू एकरूप छन्: रेखा वजन 1, रेखा वजन 2 सेतो पृष्ठभूमिमा, ज्यामितीय रेखा कला (चेभ्रन, तीर, चेकमार्क, कागजात प्रतीकहरू) सहित। पृष्ठमा मुख्यतया पाठ र सेतो ठाउँ हुन्छ; छविहरूले कुल दृश्य क्षेत्रको 3% भन्दा कम ओगटेका छन्।

न्यूनतमवाद मोनोक्रोम

https://stripe.com

प्यालेट

ब्रान्ड

Indigo Ink #533afd — भरिएका बटनहरू, चयन गरिएका नेभिगेसन अवस्थाहरू, र फोकस-संचालित रूपान्तरण क्षणहरूको लागि बैजनी रंग प्रयोग गरिन्छ।
Indigo Hover #7389ff — लिङ्कहरू, ट्यागहरू र छोटो वाक्यांशहरू हाइलाइट गर्न बैजनी रंग प्रयोग गरिन्छ। यसलाई कल टु एक्शनको लागि प्राथमिक रंगको रूपमा प्रयोग गर्नु हुँदैन।

तटस्थ

Midnight Ink #061b31 — मुख्य शीर्षक र मुख्य भागको पाठ गहिरो, लगभग कालो रङको छ जसमा चिसो नीलो रंग छ, जसले सम्पूर्ण फन्ट प्रणालीको आधारको रूपमा काम गर्दछ।
Slate #64748d — खैरो रंगको पाठले लिङ्कहरू, ट्यागहरू र छोटो वाक्यांशहरूलाई हाइलाइट गर्दछ।
Steel #50617a — उप-लाइसेन्सहरूमा प्रयोग गरिएको स्लेट र मौन बैजनी टोनहरू बीच थप पाठ र सहायक सामग्रीहरू राखिएका छन्।
Smoke #839bc8 — ठूला सजावटी शीर्षकहरू र सँगैको पाठको लागि, मौन बैजनी रंग प्रयोग गरिन्छ - मुख्य अनुच्छेदहरूमा कहिल्यै पनि।
Pure White #ffffff — पृष्ठ क्यानभास र कार्डहरूको उठेको सतहहरू; पूर्वनिर्धारित पृष्ठभूमि जसको विरुद्धमा अरू सबै कुरा मापन गरिन्छ।
Mist #f8fafd — फुटर पृष्ठभूमि र खण्ड विभाजक एक सूक्ष्म शीतल छाया हो जसले दृश्यात्मक किनारा बिना क्षेत्रहरूलाई छुट्याउँछ।

टाइपोग्राफी

१२ देखि ५६ पिक्सेल सम्म · ९ चरणहरू

sohne-var — प्रतिस्थापन: Inter Tight (variable · रूपरेखाहरू 300, 400 · सम्पूर्ण इन्टरफेसमा प्रयोग गरिने एक मात्र फन्ट हेडिङ, बडी टेक्स्ट, नेभिगेसन, बटन र लेबलहरूको लागि हो। ३०० तौल ५६ पिक्सेलको स्क्रिन साइजमा पनि प्रबल हुन्छ, जुन एक विशिष्ट विशेषता हो: हेडिङहरू कराउनुको सट्टा फुसफुसाउँछन्, भोल्युमको सट्टा संयम मार्फत अधिकार स्थापित गर्छन्। ४०० तौल नेभिगेसन र बटन टेक्स्टको लागि १४-१६ पिक्सेलमा मात्र देखिन्छ, जहाँ सानो आकारमा सुवाच्यताको लागि अतिरिक्त स्ट्रोक आवश्यक पर्दछ।

अन्तराल र रूप

उद्देश्य	अर्थ
घनत्व	फराकिलो
आधारभूत चरण	8px
बटनको त्रिज्या	4px
कार्डको अर्धव्यास	4px
छायाँहरू	छायाँको सट्टा कुनै - किनारा छैन
खण्डहरू बीच	96px
पृष्ठ चौडाइ	1320px

एआईले तपाईंको वेबसाइट Stripe शैलीमा बनाउनेछ र यसलाई भर्नेछ

लिङ्क मार्फत उत्पादनहरू र पोस्टहरू भर्नुहोस् - Instagram, TikTok, Facebook ।
आफ्नो पुरानो साइटबाट सामग्री स्थानान्तरण गर्नुहोस्—केवल ठेगाना निर्दिष्ट गर्नुहोस्।
उत्कृष्ट इन्जिनमा आधुनिक डिजाइन: सर्भर रेन्डरिङ र SEO अप्टिमाइजेसनको साथ React ( Next.js)।
खोज परिणाम र तंत्रिका नेटवर्क सिफारिसहरूको लागि पूर्ण स्वचालित SEO अप्टिमाइजेसन।

यस शैलीमा वेबसाइट बनाउनुहोस्

उस्तै शैलीहरू

Ui — म्याट पेपरमा क्लिनिकल योजना
monopo saigon — सम्पादकीय मौनता पछाडिको तरल, इंद्रधनुषी चमक—पग्लिएको प्रकाशमा तैरिरहेको मोनोक्रोम सम्पादकीय ग्यालरी
Ventriloc — न्यानो कागजमा डेटाको सम्पादकीय वेधशाला - मोनोक्रोम शुद्धता हाइलाइट गर्ने एकल सुन्तला अंगारो
Hyer Aviation — चर्मपत्रमाथि ककपिटमा साँझ। फिक्का बिहानको आकाशले फ्युजलेज आकारको सेरिफ लोगोलाई भेट्छ, र एकल न्यानो माटोको उच्चारणले मोनोक्रोम संयम तोड्छ।
Family — क्रिम चर्मपत्रमा परी कथाबाट फैलिएको
OFF+BRAND. — न्यानो चर्मपत्रमा इंद्रधनुषी गोला
Geniestudio — एउटा नरम डेलाइट नोटबुक—चौडा मार्जिन र एउटा बाक्लो पेन स्ट्रोक भएको किसिमको
xAI — कालो चक्की सहितको न्यानो क्रिम ल्याब
Seed — प्रयोगशालाको गिलास मुनि एउटा जीवित जीव
Cosmos — लिनेनले घेरिएको र पोलारोइडले झुण्ड्याइएको ग्यालरी भित्ता
Cal — मोनोक्रोम व्यावहारिकता, एक मानवीय दृष्टिकोण। एउटा प्रणाली जसले कडा कालो-सेतो प्यालेट मार्फत स्पष्टता र कार्यक्षमतालाई प्राथमिकता दिन्छ, तर मैत्रीपूर्ण टाइपोग्राफी र गोलाकार आकारहरूले यसलाई नरम बनाउँछ।
T1 Energy — न्यानो चर्मपत्रमा उत्पादन सुविधाको रेखाचित्र एउटा शान्त, मोनोक्रोम दृश्य हो जहाँ औद्योगिक स्तर र सूक्ष्म टाइपोग्राफीले सम्पूर्ण ब्रान्डलाई मूर्त रूप दिन्छ।