
Shopify
మిడ్నైట్ గ్రీన్హౌస్ - ముదురు టర్కోయిస్ నేపథ్యంపై, పుదీనా యొక్క ఒకే ఒక్క నిప్పురవ్వతో ప్రకాశించే ట్రేడ్మార్క్లు వికసిస్తాయి
షాపిఫై యొక్క డిజైన్ సిస్టమ్ వాణిజ్యం కోసం ఒక అర్ధరాత్రి కార్యశాల లాంటిది: ముదురు టర్కోయిస్ ఆకుపచ్చ రంగుతో కూడిన దాదాపు నలుపు కాన్వాస్, విశాలమైన, ఆత్మవిశ్వాసంతో కూడిన శాన్-సెరిఫ్ టైప్ఫేస్, మరియు ఇంటరాక్టివ్ క్షణాలను ఉత్తేజపరిచే ఒకే ఒక్క ప్రకాశవంతమైన పుదీనా రంగు యాక్సెంట్. ఈ ఇంటర్ఫేస్ ఒక డార్క్రూమ్ను పోలి ఉంటుంది, ఇక్కడ ఉత్పత్తులు మరియు బ్రాండ్లే కాంతికి మూలం—దాదాపు నలుపు ఉపరితలాలపై ఫోటోలు మరియు స్టోర్ఫ్రంట్లు ప్రకాశిస్తుండగా, క్రోమ్ అంశాలు వెనక్కి తగ్గుతాయి. కాంపోనెంట్లు జ్యామితీయంగా ఉన్నప్పటికీ మృదువుగా ఉంటాయి: సన్నని అంచులతో 12px-రేడియస్ కార్డ్లు, గుళిక ఆకారపు బటన్లు, మరియు స్కేల్ను బిగ్గరగా అరవకుండా గుసగుసలాడే 330-వెయిట్ టైప్ఫేస్. వ్యాపారుల కథనాలు దృశ్యపరంగా ప్రధాన ఆకర్షణగా ఉండేలా చూసుకోవడానికి, ఫంక్షనల్ క్షణాల కోసం రంగును కేటాయిస్తూ, లింక్లు, ట్యాగ్లు మరియు ఫోకస్ స్టేట్లపై ఒకే ఒక్క క్రోమాటిక్ విరామ చిహ్నాన్ని (#36f4a4) అరుదుగా ఉపయోగిస్తారు.
గరిష్ట వెడల్పు సుమారు 1280px, ఇది మధ్యలో ఉంటుంది, మరియు పూర్తి-వెడల్పు స్ప్లాష్ బ్లాక్లు ఫోటో కంటైనర్ను దాటి విస్తరించి ఉంటాయి. పేజీ యొక్క క్రమం ఈ విధంగా మారుతూ ఉంటుంది: (1) ఓవర్లే చేయబడిన హెడ్లైన్ మరియు కాల్-టు-యాక్షన్ బటన్లతో కూడిన పూర్తి-వెడల్పు డార్క్ స్ప్లాష్ పేజీ, (2) 2 కాలమ్లలో గరిష్ట-వెడల్పు టెక్స్ట్ మరియు ఇమేజ్ బ్లాక్లతో లేదా 3 కాలమ్లలో ఇమేజ్ గ్రిడ్లతో కూడిన సౌకర్యవంతమైన డార్క్ విభాగాలు, (3) లోతైన కాన్వాస్పై ఉబ్బెత్తుగా ఉండే కార్డ్లుగా ప్రదర్శించబడే ఇంటరాక్టివ్ షోకేస్ ప్యానెల్లు (ప్రొడక్ట్ కార్డ్, షిప్పింగ్ కాలిక్యులేటర్, ప్రపంచ పటం). నావిగేషన్ అనేది ఒక స్థిరమైన టాప్ బార్, ఇందులో లోగో + 3 నావిగేషన్ ఎలిమెంట్స్ + సెకండరీ లింక్లు + ప్రాథమిక కాల్-టు-యాక్షన్ బటన్ ఉంటాయి, ఇవన్నీ కుడివైపుకు అమర్చబడి ఉంటాయి. నిలువు క్రమం విభాగాల మధ్య 80px ఖాళీలను సున్నితమైన మార్పుతో ఉపయోగిస్తుంది—డార్క్ విభాగాల మధ్య ఎటువంటి విభజనలు ఉండవు, కేవలం ఉపరితల రంగులో మార్పు మాత్రమే ఉంటుంది.
విజువల్ డిజైన్ ప్రధానంగా రిటైలర్పై దృష్టి పెడుతుంది: పూర్తి-పరిమాణ ఉత్పత్తి ఫోటోలు మరియు బ్రాండ్ ఈవెంట్ల నుండి తీసిన ఫోటోలు, తరచుగా పెద్ద నేపథ్యాలపై తెల్లని అక్షరాలతో కూడి, దృశ్యపరంగా ఎక్కువ ప్రాధాన్యతను కలిగి ఉంటాయి. ఈ చిత్రాలు చాలా దగ్గరగా కత్తిరించబడి, అధిక కాంట్రాస్ట్తో, మరియు పండుగ వాతావరణాన్ని ప్రతిబింబించేలా ఉంటాయి (నాస్డాక్ గంట మోగడం, సామూహిక శుభాకాంక్షలు, చేతిలో ఉన్న ఉత్పత్తుల క్లోజప్లు). ముదురు నేపథ్యం కారణంగా, ఈ ఫోటోలు స్పాట్లైట్ల ద్వారా ప్రకాశింపబడుతున్నాయనే భావన కలుగుతుంది. ఇలస్ట్రేషన్లు చాలా సరళంగా ఉంటాయి—ప్రధాన వివరణాత్మక పనిని పొందుపరిచిన ఉత్పత్తి చిత్రాలు మరియు స్టోర్ఫ్రంట్ల స్క్రీన్షాట్లు చేస్తాయి. ఐకాన్లు మోనోక్రోమ్లో, 1.5–2px లైన్ వెడల్పుతో, సాధారణంగా తెలుపు లేదా యాక్టివ్ స్టేట్ల కోసం #36f4a4 రంగులో ఉంటాయి.
పాలెట్
బ్రాండ్
- Shopify Mint
#36f4a4— యాక్టివ్ నావిగేషన్ ఇండికేటర్లు, ఫోకస్ రింగ్లు, ట్యాగ్ హైలైట్లు మరియు లింక్లపై హోవర్ హైలైట్లు మాత్రమే ముదురు నేపథ్యానికి వ్యతిరేకంగా ఇంటరాక్టివిటీ సాధ్యమైందనే భావనను కలిగించే రంగుల మెరుపులు.
తటస్థ
- Midnight Forest
#02090a— పేజీ కాన్వాస్, హెడర్ నేపథ్య చిత్రాలు, విభాగం నేపథ్య చిత్రాలు - Deep Lichen
#061a1c— ప్రధాన కార్డ్ ఉపరితలాలు, ఉబ్బెత్తు ప్యానెల్లు, కంటెంట్ బ్లాక్లు. - Shaded Fern
#072720— నావిగేషన్ ప్యానెల్, అదనపు కార్డ్లు, ప్యానెల్ కొద్దిగా పైకి లేవడం గమనించలేకపోవడం. - Spruce Border
#1e2c31— కార్డుల కోసం సన్నని అంచులు, విభజన రేఖలు, ఇన్పుట్ ఫీల్డ్ అవుట్లైన్లు. - Abyss Indigo
#000a1e— ఉత్పత్తులు/ప్రదర్శనలను పొందుపరచడానికి అదనపు ఉపరితలం, విధుల వివరణలతో కూడిన ప్యానెల్లు. - Pure White
#ffffff— ప్రధాన టెక్స్ట్, బటన్ ఫిల్, టైటిల్, లోగోలు.
టైపోగ్రఫీ
12 నుండి 70 పిక్సెల్స్ వరకు · 8 దశలు
- Neue Haas Grotesk — భర్తీ: Inter · రూపురేఖలు 330, 400, 500, 550, 600 · ప్రధాన టైపోగ్రాఫిక్ వ్యవస్థలో బిగ్గరగా కాకుండా సూక్ష్మంగా ఉండే 70–96px (330–400) ఫాంట్ వెయిట్తో కూడిన హెడ్లైన్లు; 16–18px (400–500) ఫాంట్ వెయిట్తో కూడిన బాడీ కాపీ; మరియు 14–16px (500–550) ఫాంట్ వెయిట్తో కూడిన నావిగేషన్ మరియు యూజర్ ఇంటర్ఫేస్ ఉంటాయి. పెద్ద స్క్రీన్ సైజులలో 330 అనే అతి తేలికైన ఫాంట్ వెయిట్ ఒక ప్రత్యేక లక్షణం: ఇది భారీగా కాకుండా సంయమనం ద్వారా విశ్వాసాన్ని తెలియజేస్తుంది.
- Inter Variable — భర్తీ: Inter · రూపురేఖలు 400, 420, 450, 550 · నావిగేషనల్ ఇంటర్ఫేస్ ఎలిమెంట్స్, చిన్న నోట్స్, ట్యాబ్ కంట్రోల్స్ మరియు ఫుటర్లలోని మైక్రోటెక్స్ట్లో ఉపయోగించే ఒక ద్వితీయ ఫాంట్ రకం. దీని కొద్దిగా పెద్దవైన చిన్న అక్షరాలు మరియు మరింత ప్రామాణికమైన అక్షరాల మధ్య దూరం, దీనిని చిన్న సైజులలో కూడా మరింత సులభంగా చదవగలిగేలా చేస్తాయి. అలాగే, రెగ్యులర్ మరియు మీడియం-సైజ్ ఫాంట్ల మధ్య ఖాళీని 420-వెయిట్ ఫాంట్ పూరించాల్సిన సందర్భాలకు కూడా ఇది అనుకూలంగా ఉంటుంది.
విరామాలు మరియు రూపం
| ఉద్దేశ్యం | అర్థం |
|---|---|
| సాంద్రత | సగటు |
| ప్రాథమిక దశ | 12px |
| బటన్ వ్యాసార్థం | 9999px |
| కార్డ్ వ్యాసార్థం | 12px |
| నీడలు | నీడలకు బదులుగా అంచులు లేవు |
| విభాగాల మధ్య | 80px |
| పేజీ వెడల్పు | 1280px |
AI మీ వెబ్సైట్ను Shopify శైలిలో నిర్మించి, దానిని నింపుతుంది
- ఈ లింక్ ద్వారా ఉత్పత్తులు మరియు పోస్ట్లతో నింపండి - Instagram, TikTok, Facebook.
- మీ పాత సైట్ నుండి కంటెంట్ను బదిలీ చేయండి—కేవలం చిరునామాను పేర్కొనండి.
- అత్యుత్తమ ఇంజిన్ అయిన React ( Next.js) పై ఆధునిక డిజైన్, సర్వర్ రెండరింగ్ మరియు ఎస్ఈఓ ఆప్టిమైజేషన్తో వస్తుంది.
- శోధన ఫలితాలు మరియు న్యూరల్ నెట్వర్క్ సిఫార్సుల కోసం పూర్తిగా స్వయంచాలక SEO ఆప్టిమైజేషన్.
సారూప్య శైలులు
- Retool — వెచ్చని అబ్సిడియన్ కార్యశాల - ఖచ్చితమైన పనిముట్ల కోసం ఒక ఉపరితలం, మండుతున్న నిప్పుకణికల వెలుగులో, ప్రతిదీ సృష్టించబడే చోటు.
- Elektron — అర్ధరాత్రి వేళ పరికరాల నియంత్రణ ప్యానెల్ దాదాపు ఒక నల్లటి కాన్వాస్ లా ఉంటుంది, దానిపై ఉత్పత్తి ఫోటోలు ప్రకాశిస్తుండగా, ఇంటర్ఫేస్ మాత్రం దాదాపు కనిపించకుండా ఉంటుంది.
- REKKI — ఫోటో ల్యాబ్లో ఫ్లైట్ కంట్రోల్ ప్యానెల్
- OFFFICE : — ఏకశిలా ఫాంట్లో మునిగిపోయిన ఒక నల్లని గ్యాలరీ
- Clyde — ఒకే ఒక్క స్పాట్లైట్తో ఉన్న ఆ షోరూమ్, దాదాపు చీకటిగా ఉండే ఒక గ్యాలరీ. అక్కడ గదిలో వెచ్చని గ్రేడియంట్ బంతి తప్ప మరే రంగు ఉండదు.
- Channel Studio — ఒక పగడపు లాంప్షేడ్తో కూడిన స్టూడియో ఫోటో ల్యాబ్
- Electronic Materials Office — బొగ్గుతో అలంకరించబడిన గ్యాలరీలో మండుతున్న నిప్పుకణిక
- ORYZO AI — డార్క్రూమ్ గురించిన ఒక ఫోటో వ్యాసం. వెచ్చని చీకటిలో తేలియాడుతున్న ఒక ఏకాంత వస్తువు, క్రీమ్ రంగు అక్షరాలు మాత్రమే అలంకరణ.
- Factory — అర్ధరాత్రి వేళ "వార్ రూమ్" టెర్మినల్. ఆ "ఫ్యాక్టరీ" అనేది పూర్తిగా నల్లగా ఉన్న ఒక కంట్రోల్ ప్యానెల్, దానిపై ఫ్లాష్లైట్ వెలుగులో ఒక సందేశంలా ఒకే ఒక్క తెల్లటి కార్డు వచ్చి పడుతుంది—ఆ గదిలో ఉన్న ఏకైక వస్తువు ఆ పనే.
- Hungry Tiger — తందూరి గోడ మీద పసుపు పచ్చగా మెరుస్తున్న గ్రాఫిటీ. బంగారం, తుప్పు రంగు గోధుమ వర్ణాల ఏకీకృత వర్ణపటంలో, అక్షరాలు ఎంత పెద్దగా ఉన్నాయంటే అవి ఒక వెబ్సైట్లా కాకుండా సుగంధ ద్రవ్యాల మార్కెట్ బోర్డులా కనిపిస్తున్నాయి.
- Bibliothèque — స్పాట్లైట్ కింద ఒక నల్లని ఘనాకారపు గ్యాలరీ – విశాలమైన, చీకటి హాలులో ఒంటరిగా వెలుగుతున్న ఒక పలక
- Apple (España) — ప్రకాశవంతమైన అమరికలతో కూడిన నల్ల థియేటర్