
Shopify
Serra di mezzanotte - I marchi fiuriscenu contr'à un sfondate turchese prufondu, illuminatu da una sola scintilla di menta
U sistema di cuncepimentu di Shopify hè un attellu di mezzanotte per u cummerciu: una tela quasi nera tinta cù un verde turchese prufondu, un carattere sans-serif largu è sicuru, è un unicu accentu vibrante di menta chì attiva mumenti interattivi. L'interfaccia s'assumiglia à una camera oscura, induve i prudutti è e marche sò a fonte di luce - e foto è e vetrine brillanu contr'à superfici quasi nere, mentre chì l'elementi cromati si ritiranu. I cumpunenti sò geometrichi ma morbidi: carte cù un raghju di 12px cù bordi sottili, buttoni in forma di pillola è un carattere di pesu 330 chì sussurra a scala piuttostu chè grida. Un unicu segnu di punteggiatura cromatica (#36f4a4) hè adupratu cù parsimonia nantu à i ligami, i tag è i stati di focus, riservendu u culore per i mumenti funziunali per assicurà chì e storie di i cummercianti fermanu u puntu focale visuale.
A larghezza massima hè ~1280px, centrata, cù blocchi di splash à larghezza piena chì si estendenu oltre u contenitore di foto. U ritmu di a pagina alterna: (1) una pagina di splash scura à larghezza piena cù un titulu sovrappostu è buttoni di chjama à l'azzione, (2) sezioni scure cunfurtevuli cù testu di larghezza massima è blocchi d'imagine in 2 colonne o griglie d'imagine in 3 colonne, (3) pannelli di vetrina interattivi (carta di u produttu, calculatrice di spedizione, mappa di u mondu) visualizati cum'è carte in rilievu nantu à una tela più prufonda. A navigazione hè una barra superiore fissa cù u logu + 3 elementi di navigazione + ligami secundarii + u buttone di chjama à l'azzione primariu, tutti allineati à diritta. U ritmu verticale usa spazii di 80px trà e sezioni cù una transizione fluida - senza divisori trà e sezioni scure, solu un cambiamentu di tonu di a superficia.
U disignu visuale hè principalmente focalizatu annantu à u rivenditore: e foto di i prudutti à grandezza naturale è e foto di l'eventi di a marca portanu a maiò parte di u pesu visuale, spessu in forma di grandi sfondi cù testu biancu sovrappostu. L'imagine sò ritagliate strettamente, à altu cuntrastu è di natura festiva (u sonu di a campana di u Nasdaq, saluti di gruppu, primi piani di i prudutti in manu). U fondu scuru crea l'impressione chì ste foto sò illuminate da riflettori. L'illustrazioni sò minimaliste: u principale travagliu esplicativu hè realizatu da immagini di prudutti integrate è screenshots di vetrine. L'icone sò monocromatiche, cù una larghezza di linea di 1,5-2px, tipicamente bianche o #36f4a4 per i stati attivi.
Paletta
Marca
- Shopify Mint
#36f4a4— L'indicatori di navigazione attiva, l'anelli di focus, l'evidenziazione di tag è l'evidenziazione di u hover nantu à i ligami sò l'unicu scintilliu cromaticu chì crea un sensu d'interattività attivata contr'à un sfondate scuru.
Neutru
- Midnight Forest
#02090a— Tela di pagina, imagine di fondu di l'intestazione, imagine di fondu di a sezzione - Deep Lichen
#061a1c— Superficie di carte principali, pannelli rialzati, blocchi di cuntenutu. - Shaded Fern
#072720— Pannellu di navigazione, carte supplementari, alzamentu appena perceptibile di u pannellu. - Spruce Border
#1e2c31— Bordi fini per carte, linee di divisione, contorni di campi di input. - Abyss Indigo
#000a1e— Superficie supplementaria per l'integrazione di prudutti / dimostrazioni, pannelli cù descrizzioni di funzioni. - Pure White
#ffffff— Testu principale, riempimentu di buttoni, tìtulu, loghi.
Tipografia
da 12 à 70px · 8 passi
- Neue Haas Grotesk — rimpiazzamentu: Inter · contorni 330, 400, 500, 550, 600 · U sistema tipograficu principale hè custituitu da tituli cù un pesu di carattere di 70-96px (330-400) chì sò suttili piuttostu chè forti; u testu di u corpu cù un pesu di carattere di 16-18px (400-500); è a navigazione è l'interfaccia utente cù un pesu di carattere di 14-16px (500-550). U pesu di carattere ultraligeru di 330 à schermi di grande dimensione hè una caratteristica distintiva: trasmette fiducia per via di a moderazione piuttostu chè di u vulume.
- Inter Variable — rimpiazzamentu: Inter · contorni 400, 420, 450, 550 · Un tipu di carattere secundariu utilizatu in l'elementi di l'interfaccia di navigazione, note chjuche, cuntrolli di tabulazione è microtestu in i piè di pagina. E so lettere minuscule ligeramente più grande è a spaziatura di e lettere più standard u rendenu più leggibile in dimensioni compatte. Hè ancu adattatu per situazioni induve un carattere di pesu 420 riempie u spaziu trà un carattere regulare è unu di taglia media.
Intervalli è forma
| Scopu | Significatu |
|---|---|
| Densità | mediu |
| Passu basicu | 12px |
| Raggiu di u buttone | 9999px |
| Raggiu di a carta | 12px |
| Ombre | nò - bordi invece di ombre |
| Trà e sezioni | 80px |
| Larghezza di a pagina | 1280px |
L'IA custruisce u vostru situ web in stile Shopify è u riempirà
- Riempite cù prudutti è publicazioni via u ligame - Instagram, TikTok, Facebook.
- Trasferisce u cuntenutu da u vostru vechju situ - basta à specificà l'indirizzu.
- Design mudernu nant'à u megliu mutore: React ( Next.js) cù rendering di u servitore è ottimizazione SEO pronta per l'usu.
- Ottimizazione SEO cumpletamente automatizata per i risultati di ricerca è e raccomandazioni di rete neurale.
Stili simili
- Retool — Un attellu d'ossidiana caldu - una superficia per strumenti di precisione, illuminata da braci fumanti, induve tuttu hè creatu
- Elektron — U pannellu di cuntrollu di l'equipaggiu à mezanotte hè una tela guasi nera, induve e foto di i prudutti brillanu mentre l'interfaccia ferma praticamente invisibile.
- REKKI — Pannellu di cuntrollu di volu in u laburatoriu fotograficu
- OFFFICE : — una galeria noir inghjuttita in caratteri monolitichi
- Clyde — A sala di mostra, cù u so unicu spotlight, hè una galeria guasi scura induve l'unicu culore in a stanza hè una palla di gradiente caldu.
- Channel Studio — Un laburatoriu fotograficu di studio cù un paralume di corallo
- Electronic Materials Office — Una brace incandescente in una galleria decorata cù carbone
- ORYZO AI — Un saggio fotograficu annantu à una camera scura. Un oggettu sulitariu chì si libra in a calda bughjura, cù u caratteru crema cum'è sola decorazione.
- Factory — U terminal di a "sala di guerra" à mezanotte. A "fabbrica" hè un pannellu di cuntrollu neru induve una sola carta bianca atterra cum'è un dispacciu illuminatu da una torcia - l'unicu ughjettu in a stanza hè u travagliu stessu.
- Hungry Tiger — Graffiti brillanti di curcuma nant'à u muru di u tandoor. Una paleta unificata d'oru è di marrone ruggine, cù un carattere cusì grande chì pare più un segnu di mercatu di spezie chè un situ web.
- Bibliothèque — Una galeria nera in forma di cubu sottu à un riflettore - una sola piastra illuminata in una vasta sala scura
- Apple (España) — teatru neru cù apparecchi illuminati