Medium

सुनहरे समय में मलाईदार सफेद अखबार

मीडियम एक साहित्यिक पठन कक्ष की तरह काम करता है जिसे वेब पर स्थानांतरित कर दिया गया है: SaaS में आम तौर पर पाए जाने वाले नीरस सफेद रंग की जगह एक गर्म, मलाईदार पृष्ठभूमि (#f7f4ed) का उपयोग किया गया है, जिससे लंबे लेख मुद्रित पृष्ठ जैसे प्रतीत होते हैं। दृश्य प्रणाली पूरी तरह से मोनोक्रोम है—लगभग सभी UI सतहें, टेक्स्ट और बॉर्डर #242424 से #6b6b6b तक फैले गर्म धूसर रंग की एक संकीर्ण पट्टी में हैं—ताकि पाठक का ध्यान पूरी तरह से सामग्री पर केंद्रित रहे। एकमात्र विशिष्ट पहचान सेरिफ़ शीर्षक (GT सुपर, 120px, वेट 400, लेटर स्पेसिंग -0.055em) है, जो जानबूझकर एक विपरीत चलन का विकल्प है: एक बोल्ड ज्यामितीय सैन्स-सेरिफ़ के बजाय, प्रदर्शन के लिए स्केल किया गया एक ट्रांज़िशनल बुक सेरिफ़ फ़ॉन्ट, जो मुश्किल से ध्यान देने योग्य है, यह संकेत देता है: "हम किताबें प्रकाशित करते हैं, सॉफ़्टवेयर नहीं।" बटन लगभग काले रंग के "गोल" आकार के हैं - पृष्ठ पर एकमात्र ठोस रंग यही है।

होमपेज में दो कॉलम हैं: बायां कॉलम पेज के लगभग 55% हिस्से में है, जिसमें हेडलाइन, सबटेक्स्ट और कॉल टू एक्शन को पर्याप्त आंतरिक स्पेसिंग के साथ लंबवत रूप से व्यवस्थित किया गया है; दायां कॉलम पेज के लगभग 45% हिस्से में है, जिसमें एक इलस्ट्रेशन पैनल है। बायां कॉलम बाईं ओर संरेखित है (केंद्र में नहीं), जो पेज को पढ़ने की दिशा में स्थिर रखता है। होमपेज के नीचे, पेज एक सिंगल, फुल-विड्थ, क्रीम रंग की पट्टी है जिसमें फ़ूटर में केंद्र में लिंक दिए गए हैं। होमपेज पर कोई कार्ड ग्रिड, फीचर सेक्शन या वैकल्पिक पट्टियां नहीं हैं—होमपेज एक पेज है। कंटेंट घनत्व जानबूझकर कम रखा गया है: एक हेडलाइन, एक वाक्य, एक बटन, एक इमेज। यह पेज एक कवर पेज है, डैशबोर्ड नहीं।

चित्र संपादकीय और सामयिक हैं, व्यवस्थित नहीं। मुख्य पृष्ठ पर एक ही हाथ से बनाया गया चित्र (एक हरा फूल, एक ज्यामितीय हाथ, नक्षत्रों की रेखाएँ) है, जो एक सहज और कुछ हद तक सरल शैली में बना है। ये चित्र किसी स्थायी संग्रह से लिए गए चित्रों की तरह नहीं, बल्कि मौसमी बदलावों के साथ तैयार किए गए लगते हैं। मुख्य पृष्ठ पर कोई फ़ोटो नहीं है। मुख्य पृष्ठ पर कोई आइकन भी नहीं है—सारा काम टेक्स्ट लोगो और टेक्स्ट द्वारा किया गया है। दृश्य भाषा मुख्य रूप से टेक्स्ट-आधारित है, जिसमें चित्र विराम चिह्नों का काम करते हैं।

शुद्ध SaaS संपादकीय एक रंग का

https://medium.com

पैलेट

तटस्थ

Newsprint Cream #f7f4ed — पेज कैनवास, मुख्य विंडो बैकग्राउंड और सेक्शन बैकग्राउंड एक गर्म, हल्के क्रीम रंग के हैं जो डिजिटल इंटरफेस के बजाय प्रिंटेड इंटरफेस का एहसास कराते हैं।
Paper White #ffffff — कार्ड की सतहें, उभरे हुए पैनल, फॉर्म एंट्री फ़ील्ड और कोई भी सतह जिसे क्रीम कैनवास से अलग करने की आवश्यकता है।
Ink #242424 — बॉडी टेक्स्ट, लिंक, हेडिंग - शुद्ध काले रंग से थोड़ा गर्म रंग, क्रीम बैकग्राउंड पर अच्छा दिखता है।
Body Gray #333333 — द्वितीयक पाठ रंग और डिफ़ॉल्ट अग्रभूमि रंग का उपयोग वहां किया जाता है जहां कंट्रास्ट खोए बिना स्याही के रंग से थोड़ा हल्का रंग आवश्यक होता है।
Button Black #191919 — द्वितीयक यूआई तत्वों, विभाजकों और म्यूटेड लेबलों के लिए एक तटस्थ रंग समर्थित है। इसे कॉल टू एक्शन के प्राथमिक रंग के रूप में उपयोग नहीं किया जाना चाहिए।
Marginalia Gray #6b6b6b — सेकेंडरी यूआई, डिवाइडर और म्यूटेड लेबल के लिए न्यूट्रल कलर सपोर्ट।

टाइपोग्राफी

13 से 120px तक · 5 चरण

medium-content-sans-serif-font — प्रतिस्थापन: Inter · रूपरेखा 400 · medium-content-sans-serif फ़ॉन्ट - निकाले गए डेटा में पाया गया लेकिन एआई द्वारा इसका वर्णन नहीं किया गया।
GT Super — प्रतिस्थापन: Playfair Display · रूपरेखा 400 · शीर्षक और मुख्य पाठ में ट्रांज़िशनल बुक सेरिफ़ फ़ॉन्ट का इस्तेमाल किया गया है, जो अत्यधिक बड़े आकार का है और इसमें अक्षरों के बीच कम से कम दूरी और पंक्तियों के बीच 0.83 का अंतर है। 120px पर 400 वेट (बोल्ड नहीं) का चुनाव इसकी एक खास विशेषता है: वेट नहीं, बल्कि अक्षरों का आकार ही कमाल का है। नेगेटिव लेटर स्पेसिंग से अक्षरों के बीच का गैप कम हो जाता है, जिससे "ह्यूमन स्टोरीज़ एंड आइडियाज़" एक सुसंगत टाइपोग्राफिक ब्लॉक जैसा लगता है।
Söhne — प्रतिस्थापन: Inter · रूपरेखा 400 · नेविगेशन, बटन, उपशीर्षक और छोटे शीर्षकों के लिए UI sans-serif फ़ॉन्ट का उपयोग किया जाता है। 13–14px की रेंज नेविगेशन लेबल और बटनों के लिए है; 20–22px उपशीर्षकों और शीर्षक के भीतर द्वितीयक पाठ के लिए है। मानवीय अनुपात वाला यह साफ़ sans-serif फ़ॉन्ट छोटे आकार में भी स्पष्ट रूप से पढ़ा जा सकता है और बड़े आकार में भी सहज दिखता है।

अंतराल और रूप

उद्देश्य	अर्थ
घनत्व	औसत
बुनियादी कदम	16-24px
बटन त्रिज्या	9999px
कार्ड त्रिज्या	0px
छैया छैया	नहीं - छाया के बजाय बॉर्डर
अनुभागों के बीच	64px
पृष्ठ की चौड़ाई	1200px

एआई आपकी वेबसाइट को Medium शैली में बनाएगा और उसमें डेटा भरेगा।

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

इस शैली में एक वेबसाइट बनाएं

समान शैलियाँ

Steep — गर्म कागज पर सेरिफ़ फ़ॉन्ट का विश्लेषण
Newformcap — ड्रेसिंग रूम में संपादकीय अखबार
Claude — गर्म चर्मपत्र पर मुद्रित एक कलाकृति—हड्डी के कागज पर स्याही, रंग की एकमात्र झलक के रूप में मिट्टी।
11x– Digital workers — एक सिनेमाई संपादकीय बंजर भूमि—परिदृश्य की पैनोरमिक तस्वीरें, बड़े-बड़े अक्षरों में लिखे शीर्षकों के साथ प्रस्तुत की गई हैं, जो किसी लक्जरी पत्रिका के पृष्ठपृष्ठ की तरह लगती हैं।
Revolut — बादलों की एक तस्वीर पर आधारित एक मोनोक्रोम संपादकीय कृति—सफेद स्याही, पिलबॉक्स बटन, और अन्यथा धूसर दुनिया में रंग की एक अकेली नीली पट्टी।
Scheduling — क्रीम रंग के कागज पर संपादकीय स्याही
Titan — गर्म रंग वाले मोनोक्रोम संग्रह
Programa — दोपहर के समय एक स्विस डिज़ाइन स्टूडियो। गैलरी की सफेद दीवार एक पीले रंग के टेबल लैंप से जगमगा रही है—सब कुछ धूसर रंग के विभिन्न शेड्स में है, जब तक कि कोई बटन, आइकन या कोई खास चीज़ नज़र में न आ जाए, और फिर वह पीला रंग पूरे कमरे को परिभाषित कर देता है।
Sana Agents — संपादकीय में सफेद पृष्ठभूमि पर नींबू की चमक
Visual — गर्मजोशी भरा संपादकीय सामिज़दत। क्रीम रंग का कागज, सेरिफ़ फ़ॉन्ट, मोनोक्रोम हाशिये पर लिखे नोट्स, एक पीला मार्कर।
Midday — चर्मपत्र पर संपादकीय ब्रोशर - गर्म पत्थर जैसी पृष्ठभूमि पर 72px सेरिफ़ शीर्षक, स्पेसिंग के साथ सैन्स-सेरिफ़ बॉडी टेक्स्ट, पिल-आकार के नियंत्रण, कोई छाया नहीं।
Chat for impact — गहरे हरे रंग का क्लिनिक जिसमें हल्के रंगों के कमरे हैं