Apple
એક જ વાદળી સ્વીચ સાથેનો સફેદ ઓરડો
એપલની ડિઝાઇન સંયમનું એક મોડેલ છે: લગભગ સફેદ કેનવાસ, પુષ્કળ સફેદ જગ્યા, અને એક જ, ગતિશીલ વાદળી ઉચ્ચારણ જે દરેક ક્રિયાને ઇરાદાપૂર્વકની લાગે છે. પ્રાથમિક ધ્યાન ટાઇપોગ્રાફી પર છે—SF Pro, જેમાં નકારાત્મક અક્ષર અંતર છે જે વધતા કદ સાથે ઘટે છે, હેડલાઇન્સને વધુ પડતા ભારે થયા વિના સ્થાપત્ય સ્પષ્ટતા આપે છે. ઉત્પાદન ડિઝાઇન છે: મોટા ઉત્પાદન ફોટા અને જીવનશૈલી છબીઓ પ્રભુત્વ ધરાવે છે, જ્યારે ક્રોમ તત્વો પાતળા ફ્રેમ્સ, અર્ધપારદર્શક નેવિગેશન અને સૂક્ષ્મ રેખાઓમાં ફરી જાય છે. પ્રમોશનલ સામગ્રી માટે પૂર્ણ-રંગીન બ્લોક્સ સાથે હળવા ગ્રે પૃષ્ઠભૂમિ સામે વિભાગો વૈકલ્પિક રીતે ગોઠવાય છે, સુશોભન તત્વોને બદલે સ્કેલમાં ફેરફાર દ્વારા લય બનાવે છે.
પેજ લેઆઉટ એક પૂર્ણ-પહોળાઈનું પૃષ્ઠ છે જેમાં કોઈ નિશ્ચિત મહત્તમ કન્ટેનર પહોળાઈ નથી—વિભાગો ધારથી ધાર સુધી ફેલાયેલા છે, જેમાં ટેક્સ્ટ બ્લોક્સ આશરે 980px પર કેન્દ્રિત છે. નેવિગેશન એક સિંગલ, ફિક્સ્ડ ગ્લોબલ બાર છે જેમાં સ્ક્રોલ પર દેખાતા દરેક ઉત્પાદન માટે વધારાના સબફોલ્ડર છે. મુખ્ય લેઆઉટ હંમેશા કેન્દ્રિત હોય છે: એક મોટું ઉત્પાદન નામ, એક-લાઇન ટેગલાઇન, બે પિલ બટનો, પછી એક ઉત્પાદન છબી જે બાકીના વ્યૂપોર્ટને ભરે છે. વિભાગો ઉદાર વર્ટિકલ લય (વિભાગો વચ્ચે 64px+), વૈકલ્પિક #f5f5f7 અને રંગીન પૃષ્ઠભૂમિ સાથે ઊભી રીતે સ્ટેક કરવામાં આવે છે. નીચેનું પૃષ્ઠ પૂર્ણ-પહોળાઈના સેવા કાર્ડ્સ (Apple TV+, Fitness+, Music, Arcade) ની એક આડી પંક્તિ છે, દરેક ઓવરલે ટેક્સ્ટ અને પિલ બટન સાથે ફોટો બ્લોક છે. કોઈ સાઇડબાર નથી, કોઈ બહુ-કૉલમ સામગ્રી લેઆઉટ નથી, કોઈ અસમપ્રમાણ રચનાઓ નથી—બધું કેન્દ્રિત, સ્ટેક્ડ અને સપ્રમાણ છે.
ફોટોગ્રાફી મુખ્ય દ્રશ્ય ભાષા છે. ઉત્પાદનના ફોટા શુદ્ધ સફેદ અથવા નરમ રાખોડી પૃષ્ઠભૂમિ સામે લેવામાં આવે છે, કોઈપણ સંદર્ભ વિના - ઉપકરણ એ તારો છે, અલગ અને પ્રકાશિત. જીવનશૈલીના ફોટા પૂર્ણ-પહોળાઈના બેનરોમાં પ્રદર્શિત થાય છે, ઘણીવાર ચુસ્ત રીતે કાપેલા પદાર્થો સાથે. રંગ ગ્રેડિયન્ટ્સ (પેસ્ટલ વાદળી, ગુલાબી, લીલો) ઉત્પાદન વિભાગો માટે પૃષ્ઠભૂમિ તરીકે સેવા આપે છે, સુશોભન તરીકે નહીં. આઇકોનોગ્રાફી ઓછામાં ઓછી અને રેખા-આધારિત છે, 1-2px જાડા, ટેક્સ્ટ જેવા જ ગ્રેસ્કેલમાં. કોઈ ચિત્રો, કોઈ અમૂર્ત ગ્રાફિક્સ, કોઈ 3D રેન્ડરિંગ નથી, સિવાય કે ઉત્પાદનના ફોટા પોતે.
પેલેટ
બ્રાન્ડ
- 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 · હેડલાઇન્સ અને મોટા ટેક્સ્ટ—૪૦ પિક્સેલ+ કદ, સાંકડા છિદ્ર અને મજબૂત નકારાત્મક ટ્રેકિંગ માટે ડિસ્પ્લે ફોર્મેટનો ઉપયોગ કરે છે; ૭૦૦ જાહેરાત લેઆઉટ માટે આરક્ષિત છે, અને ૪૦૦ સંપાદકીય સામગ્રીમાં ઉત્પાદન નામો માટે છે.
- SF Pro Text — રિપ્લેસમેન્ટ: Inter · રૂપરેખા 300, 400, 600 · બોડી ટેક્સ્ટ, નેવિગેશન, બટનો, સબહેડિંગ્સ — વર્કિંગ ફોન્ટ; બોડી ટેક્સ્ટ માટે 400, સબહેડિંગ્સ અને ક્વોલિફાઇડ લેબલ્સ માટે 300, નેવિગેશન એલિમેન્ટ્સ અને બટન ટેક્સ્ટ માટે 600; નકારાત્મક અક્ષર અંતર કદના પ્રમાણસર ઘટે છે (-0.022em થી 12px થી -0.01em થી 44px સુધી).
અંતરાલો અને સ્વરૂપ
| હેતુ | અર્થ |
|---|---|
| ઘનતા | સરેરાશ |
| મૂળભૂત પગલું | 12px |
| બટન ત્રિજ્યા | 980px |
| કાર્ડ ત્રિજ્યા | 8px |
| પડછાયાઓ | પડછાયાને બદલે ના - સરહદો |
| વિભાગો વચ્ચે | 64px |
| પૃષ્ઠ પહોળાઈ | 1440px |
AI તમારી વેબસાઇટ Apple શૈલીમાં બનાવશે અને તેને ભરી દેશે.
- લિંક દ્વારા ઉત્પાદનો અને પોસ્ટ્સ ભરો - Instagram, TikTok, Facebook.
- તમારી જૂની સાઇટ પરથી સામગ્રી ટ્રાન્સફર કરો—ફક્ત સરનામું સ્પષ્ટ કરો.
- શ્રેષ્ઠ એન્જિન પર આધુનિક ડિઝાઇન: સર્વર રેન્ડરિંગ અને SEO ઑપ્ટિમાઇઝેશન સાથે React ( Next.js).
- શોધ પરિણામો અને ન્યુરલ નેટવર્ક ભલામણો માટે સંપૂર્ણપણે સ્વચાલિત SEO ઑપ્ટિમાઇઝેશન.
સમાન શૈલીઓ
- Ui — મેટ પેપર પર ક્લિનિકલ પ્લાન
- ElevenLabs — ગરમ ક્રીમ ટોનમાં સૂક્ષ્મ હેડલાઇન્સ સાથે ફોટો નિબંધ. બૌહાઉસ-શૈલીની નોટબુક - ઇંડાના રંગનો કાગળ, કાળી શાહી, અને ઉત્પાદન પ્રદર્શન માટે એક જ જાંબલી અને નારંગી ઉચ્ચાર.
- monopo saigon — સંપાદકીય મૌન પાછળ એક પ્રવાહી, મેઘધનુષી ચમક - પીગળેલા પ્રકાશ પર તરતી એક મોનોક્રોમ સંપાદકીય ગેલેરી
- Awesomic — નારંગી વિરામચિહ્નો સાથે સંપાદકીય ઝીંક મેશ જે કોન્ફેટીની યાદ અપાવે છે
- Monad — ગરમ ચર્મપત્ર પર સંપાદકીય ટેકનિકલ જર્નલ
- Dub — લિંકનું મેટ રાઇસ પેપર કંટ્રોલ પેનલ
- Seline Analytics — ગરમ કાગળ પર એક શાંત વિશ્લેષણાત્મક ટેબલ
- Ventriloc — ગરમ કાગળ પર ડેટાની સંપાદકીય વેધશાળા - એક જ નારંગી રંગનો અંગારો જે મોનોક્રોમ ચોકસાઇને પ્રકાશિત કરે છે.
- Duolingo — સફેદ કાગળ પર રમતિયાળ વર્ગનો માસ્કોટ
- Stripe — હિમાચ્છાદિત કાચ પર ઈન્ડિગો શાહીથી લખાયેલ હિસાબ પુસ્તક
- Notion — બપોરના તડકામાં ગરમ કાગળની નોટબુક
- Hyer Aviation — કોકપીટમાં સાંજ પડી ગઈ છે. પરોઢનું નિસ્તેજ આકાશ ફ્યુઝલેજ-કદના સેરીફ લોગોને મળે છે, અને એક ગરમ માટીનો ઉચ્ચાર મોનોક્રોમ સંયમ તોડે છે.