Duolingo

पांढऱ्या कागदावर खेळकर वर्गाचा शुभंकर

डुओलिंगोचा इंटरफेस लहान मुलांच्या चित्रपुस्तकाप्रमाणे डिझाइन केलेला आहे: एक पांढरा कागदी कॅनव्हास, जाडजूड, गोलाकार फॉन्ट आणि एकच, गडद हिरवा रंग जो लगेच 'योग्य उत्तर' असल्याची जाणीव करून देतो. मुख्य मजकूर शांत करणाऱ्या मध्यम राखाडी रंगाचा आहे, ज्यामुळे हिरवा आणि त्याला पूरक असलेला निळा रंग सर्व भावनिक काम करतात—हिरवा रंग प्रगती आणि शीर्षकांसाठी, तर निळा रंग क्लिक करण्यायोग्य लिंक्स आणि अतिरिक्त कृतींसाठी वापरला जातो. घटक गोळीच्या आकाराचे किंवा जाड, गोलाकार कोपऱ्यांचे असून त्यांना जाड काळ्या किंवा रंगीत कडा आहेत, ज्यामुळे प्रत्येक बटण एका सपाट UI कंट्रोलपेक्षा पानावर चिकटवलेल्या स्टिकरसारखे वाटते.

विभाग पानाच्या संपूर्ण रुंदीत पसरलेले आहेत आणि ते एकाच स्तंभात उभे मांडलेले आहेत, प्रत्येक विभाग अंदाजे ८०० पिक्सेल उंच आहे. मजकुराची कमाल रुंदी मध्यभागी अंदाजे १ पिक्सेल आहे. डावीकडील मजकूर आणि उजवीकडील चित्रे एकाआड एक येतात, ज्यामुळे पुरेशी उभी जागा (विभागांमध्ये ८० पिक्सेल) मिळते. येथे ग्रिड कार्ड किंवा बहु-स्तंभीय मांडणी नाही—प्रत्येक विभाग हा एकाच मजकूर गटासोबत एकच चित्र असलेला आहे. नेव्हिगेशन हे लोगो आणि भाषा निवडकासह एक किमानवादी शीर्ष पट्टी आहे, जी विभागांच्या मध्ये एक स्थिर पट्टी म्हणून दिसते. तळटीप ही पानाच्या संपूर्ण रुंदीवर पसरलेली एक हिरवी पट्टी आहे. याची लय संपादकीय आहे: शीर्षक, परिच्छेद, कृतीसाठी आवाहन, चित्र, पुनरावृत्ती.

पुस्तकाच्या चित्रणात्मक भाषेत गोलाकार भौमितिक आकार, ठळक काळ्या बाह्यरेषा आणि गुलाबी, जांभळा, पिवळा, नारंगी व निळा या पूरक रंगसंगतीसह सपाट, द्विमितीय शुभंकर पात्रांचा (डुएट नावाचे घुबड आणि विविध मानवी आकृत्या) समावेश आहे, जी रंगसंगती प्रत्यक्ष इंटरफेसमध्ये कधीही दिसत नाही. ही चित्रे प्रत्येक विभागाच्या उजव्या बाजूला, मजकुराशेजारी, कोणत्याही कंटेनर किंवा पार्श्वभूमीशिवाय, पूर्णपणे पांढऱ्या पार्श्वभूमीवर मांडलेली आहेत. यात कोणतीही छायाचित्रे नाहीत—ही पात्रेच दृश्य सामग्री म्हणून काम करतात. शुभंकरांच्या शैलीशी सुसंगत अशा जाड बाह्यरेषांचा वापर चिन्हांकनात केला आहे. चित्रांची घनता मध्यम आहे: प्रत्येक विभागात त्या पात्राचे एक मोठे चित्र असून, पानाचा उर्वरित भाग टायपोग्राफी आणि मोकळ्या जागेसाठी दिलेला आहे.

खेळकर किमानवाद

https://duolingo.com

पॅलेट

ब्रँड

Eager Green #58cc02 — हिरव्या रंगाचा वापर लिंक्स, टॅग्ज आणि लहान वाक्ये ठळक करण्यासाठी केला जातो. कृतीसाठीच्या आवाहनांकरिता (calls to action) तो मुख्य रंग म्हणून वापरला जाऊ नये.
Storybook Green #d7ffb8 — हलक्या पृष्ठभागांवर सौम्य हायलाइट्स, फुटरमधील नेव्हिगेशन लेबल्सच्या मागे सूक्ष्म पार्श्वभूमी टोन.

तटस्थ

Spark Blue #1cb0f6 — लिंक्स, टॅग्ज आणि लहान वाक्ये ठळक करण्यासाठी निळ्या रंगाचा वापर केला जातो. कृतीसाठीच्या आवाहनांकरिता (calls to action) तो मुख्य रंग म्हणून वापरला जाऊ नये.
Fresh Leaf #a5ed6e — हिरव्या रंगाचा वापर लिंक्स, टॅग्ज आणि लहान वाक्ये ठळक करण्यासाठी केला जातो. कृतीसाठीच्या आवाहनांकरिता (calls to action) तो मुख्य रंग म्हणून वापरला जाऊ नये.
Night Ink #000437 — लिंक्स, टॅग्ज आणि छोटे ठळक केलेले वाक्यांश जांभळ्या रंगात हायलाइट केले आहेत.
Paper White #ffffff — हिरव्या/गडद पार्श्वभूमीवर पृष्ठ कॅनव्हास, पुठ्ठ्याचे पृष्ठभाग आणि बटणावरील मजकूर.
Charcoal #4b4b4b — हीरो हेडर्स आणि बॉडी टेक्स्ट - सार्वत्रिक गडद मजकूर जो रंगीत मथळ्यांना उठून दिसण्यास मदत करतो.
Pencil Gray #777777 — मजकुराचे मुख्य परिच्छेद अस्पष्ट अक्षरांनी ठळक केले आहेत आणि दुय्यम वर्णनात्मक मजकूर पार्श्वभूमीत विलीन होतो, जेणेकरून रंगीत घटक समोर येतील.

टायपोग्राफी

१३ ते ६४ पिक्सेल · ७ टप्पे

feather — बदली: Inter · रूपरेषा 700 · "मोफत. मजेदार. प्रभावी" आणि "डुओलिंगो इंग्रजी चाचणी" यांसारखी विभाग शीर्षके एका खास गोलाकार फॉन्टमध्ये दर्शविली आहेत, ज्यामुळे ब्रँडला त्याची खेळकर, मैत्रीपूर्ण, शुभंकर-सदृश शैली मिळते. योग्य जाडीच्या "फेदर बोल्ड" किंवा "नुनिटो ब्लॅक" फॉन्टने बदला. अक्षरांमधील अंतर: -0.0200em
duolingo-sans — बदली: Inter · रूपरेषा 500 · मुख्य परिच्छेद आणि नेव्हिगेशन लिंक्स १७px/५०० वर — एक भौमितिक सॅन्स-सेरिफ फॉन्ट जो सुवाच्य राहतो, आणि ७०० लाइन वेटला महत्त्वाचे मुद्दे हायलाइट करू देतो. याऐवजी 'DIN Next', 'Inter', किंवा 'Nunito Sans' वापरा.
duolingo-sans — बदली: Inter · रूपरेषा 700 · सर्व वेट-७०० व्हॅल्यूज वापरल्या आहेत: नेव्हिगेशन लेबल्समधील कॅपिटल अक्षरे १५px (ls ०.०५३०em), उपशीर्षके १९px आणि ३२px, आणि लिंक एम्फसिस १३px आहे. मुख्य मजकुराप्रमाणेच फॉन्ट वापरला आहे—दृश्य फरक फॉन्ट बदलात नसून वेटमध्ये आहे. अक्षर अंतर: नेव्हिगेशन लेबल्समधील कॅपिटल अक्षरांसाठी ०.०५३०em.

अंतर आणि स्वरूप

उद्देश	अर्थ
घनता	दाट
मूलभूत पायरी	12px
बटण त्रिज्या	12px
कार्ड त्रिज्या	12px
सावल्या	सावल्यांऐवजी सीमा नाहीत
विभागांच्या दरम्यान	80-120px
पृष्ठाची रुंदी	1200px

एआय तुमची वेबसाईट Duolingo स्टाईलमध्ये तयार करेल आणि ती भरेल.

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

या शैलीत वेबसाइट तयार करा

समान शैली

Family — क्रीम रंगाच्या पार्चमेंट पेपरवर मांडलेले, एखाद्या परीकथेतील दृश्यासारखे चित्र.
Say Briefly — क्रीम रंगाच्या कागदावर क्रिएटिव्ह एजन्सीची स्केचबुक
Flying Papers — शनिवारी सकाळच्या कार्टूनमधील कबुलीजबाब
Portrait — क्रीम रंगाच्या कागदावर पोलरॉइड फोटोंमध्ये टिपलेली आठवणींची भिंत. एक चमकदार, क्रीम रंगाचे स्क्रॅपबुक, ज्यात गडद निळी शाई हाच एकमेव मजकूर, एकमेव रचना रेषा आणि एकमेव फ्रेमचा रंग आहे—त्यावर हाताने काढलेले एकच इंद्रधनुष्य आहे, जे 'नोंदणी करा' बटणावर आणि तिरप्या अक्षरातील 'कायम' या शब्दावर एकदाच दिसते आणि पुन्हा कधीच नाही.
Karl — एका उन्हाच्या दिवशी ३डी पॉप-अप बुक शैलीतील डायोरामा
Navigate — एका बोर्डवर लावलेला स्टिकर्सचा एक मोठा संच: मोठा विचित्र फॉन्ट, सर्व टॅब्लेटच्या आकारात आणि लोगोप्रमाणे पुनरावृत्ती होणारे पाच बहुरंगी आयकॉन्स.
Monte — समुद्रकिनाऱ्यावरील सकाळ, एका गंजलेल्या छटासह.
MotherDuck — क्रीम रंगाच्या कागदावर रंगीत पेन्सिलने कोड केलेले टर्मिनल
Wise Design — जागतिक रस्त्यावरील एक निऑन दिव्यांनी झगमगणारा बाजाराचा स्टॉल—गर्दीच्या बाजारात लक्ष वेधून घेणारी एक भडक हिरवी पाटी, आणि तिच्या मागे, उत्पादनाचा एक सुबक युझर इंटरफेस अलगदपणे नजरेस पडतो.
Hatch — हाताने काढलेली, सामिझदाट-शैलीतील रचना आणि पेस्टल रंगांच्या कँडी बाऊल्सचे मिश्रण. पुदिन्याच्या रंगाचे ठिपके, कॉन्फेटीचे थेंब आणि गोळीच्या आकाराच्या कृती-आवाहनांनी सजवलेला एक क्रीम रंगाचा कागदी कॅनव्हास, जिथे एक मोठा, ठळक सेरिफ फॉन्ट गंमतीची झलक देतो आणि कोपऱ्यात एक निळा शुभंकर डोळा मिचकावतो.
Superr — दुपारच्या कोमल प्रकाशात एक उबदार शालेय वही. एक मलई रंगाचे पान, टोपी नसलेला एक नारंगी मार्कर आणि सोलून काढण्याची वाट पाहत असलेल्या लॅमिनेटेड नावांच्या स्टिकर्सचा गठ्ठा.
Mews — पहाटेच्या वेळी गुलाबी रंगात न्हाऊन निघालेले एक हॉस्पिटॅलिटी नियंत्रण केंद्र. पांढऱ्या भिंती आणि सूर्यप्रकाशाने उजळलेली एक कार्य जागा, जिथे प्रत्येक स्क्रीनवर ठळक काळे अक्षर, उबदार क्रीम रंगाची कार्डे आणि एकच गडद गुलाबी रंगाचे ॲक्शन बटण आहे — कॉर्पोरेट संयमाऐवजी एक खेळकर आत्मविश्वास.