Apple (España)
Isang katedral ng puting espasyo na halos hindi marinig ang mga headline. Isang malawak at maliwanag na bulwagan kung saan ang napakalaking mga font na may 700 density ay nakasabit sa hangin, na pinagsasama-sama lamang ng mga kulay pastel at isang asul na sinulid.
Ang wika ng pahina ng produkto ng Apple ay isang pag-aaral sa pagiging bukas-palad ng tipograpiko: malalaking headline ng SF Pro Display na nakapatong sa isang puting background, napapalibutan ng malawak na puting espasyo na nagpaparamdam sa bawat salita na sinadya. Ang paleta ay halos monochromatic—teksto sa #1d1d1f, canvas na nagpapalit-palit sa pagitan ng #ffffff at #f5f5f7—na may iisang asul na accent (#0071e3) na eksklusibong nakalaan para sa mga interactive na sandali. Ang kulay ay naroroon sa mga imahe ng produkto mismo (mga pastel tone), hindi kailanman bilang mga pandekorasyon na elemento ng UI. Ang mga bahagi ay walang frame: mga bilugan na card na may 28px radius, mga butones na hugis-pill na halos dumadampi sa mga gilid ng pahina, na walang nakikitang mga lalagyan o drop shadow. Ang ritmo ay nalilikha sa pamamagitan ng pagpapalit-palit ng puti at kulay abong mga guhit, hindi mga divider o border.
Sinasakop ng mga seksyon ang buong lapad ng pahina, na umaabot mula gilid hanggang gilid na may malawak na padding (humigit-kumulang 40-100 gilid). Ang pinakamataas na lapad ng nilalaman ay epektibong nakasentro sa loob ng bawat strip. Ang pangunahing elemento ay isang nakasentrong stack: isang label na hugis kilay, isang pinalaking headline, isang button na call-to-action, isang hanay ng presyo, at pagkatapos ay isang larawan ng produkto na pumupuno sa ilalim ng viewport. Sinusundan ng mga seksyon ang isang paulit-ulit na pattern: isang headline na nakahanay sa kaliwa sa loob ng strip, na sinusundan ng alinman sa isang layout na may dalawang hanay na may mga paglalarawan ng produkto (teksto sa kaliwa/larawan sa kanan o salitan), isang grid ng mga baraha na may tatlong hanay, o isang nakasentrong visual showcase. Ang ritmo ng nilalaman ay ganap na kinokontrol ng salitan na puti at tatlong kulay na background na may mga patayong puwang na 100-100 cm—walang mga divider, walang mga baraha na may mga elemento. Ang global navigation ay isang iisang, nakapirming bar. Ang mga seksyon ng detalye ng produkto ay gumagamit ng mga full-width band na may malawak na padding, kung saan ang teksto ay nakasentro sa makikipot na hanay (~560px) laban sa isang mas malawak na visual na lugar.
Ang biswal na wika ng Apple ay pangunahing potograpiya ng produkto: mga close-up ng hardware laban sa purong puti o kulay na background, nang walang konteksto ng pamumuhay o mga eksenang inayos. Ang pangunahing larawan ay nagpapakita ng mga kamay na may hawak na pastel green na MacBook Neo—pangalawa ang elemento ng tao, na nagpapakita ng laki at tekstura sa halip na emosyon. Sa mga seksyon ng variant ng produkto, dalawang device ang magkatabi na inihaharap laban sa background na may magkatugmang kulay ng trim (pink, berde, pilak, asul langit), bawat isa ay may patag na field ng kulay kung saan ang produkto ay nasa gitna. Ang mga detalyadong kuha ay gumagamit ng mga matinding close-up (ang bisagra ng laptop, ang module ng camera) laban sa isang neutral na background. Walang mga ilustrasyon, walang abstract graphics, walang mga pandekorasyon na imahe—ang produkto mismo ang biswal na elemento. Ang iconography ay nasa lahat ng dako—mga monochrome line icon sa istilo ng SF Symbols, 1.5–2px ang kapal, kinuha mula sa set ng icon ng system ng Apple. Ang potograpiya ay palaging ginagawa sa isang high-key na paraan: pare-pareho, walang anino na ilaw na nagpapaliit sa produkto sa isang graphic na anyo sa halip na isang three-dimensional na bagay.
Paleta
Tatak
- Electric Blue
#0071e3— Ang mga napunang action button ang tanging kulay na nagbibigay-diin sa UI, na madalang gamitin para sa mga panawagan para sa aksyon. - Link Blue
#0066cc— Mga inline na link ng teksto, mga link na may mga arrow at chevron. - Citrus Gradient
#3b3b23— Ang isang alternatibong pagtatapos na naging tampok na katangian ng produkto ay ang maitim na base na kumukupas patungo sa dilaw-berdeng mga highlight.
Neutral
- Primary Ink
#1d1d1f— Ang mga headline, body text, at mga label ng button ang nangingibabaw na tono sa harapan sa lahat ng ibabaw; ang background ng pangunahing larawan ng produkto ay maayos na lumilipat mula sa isang solidong #1d1d1f sa itaas patungo sa isang chromatic blue. - Mid Gray
#707070— Pangalawang teksto, hindi aktibong estado ng nabigasyon, mga naka-mute na label ng UI - Deep Gray
#474747— Ang teksto ng nabigasyon at ikonograpiya ay nasa katamtamang laki ng font. - Hairline
#d6d6d6— Manipis na mga hangganan sa pagitan ng mga seksyon at mga elemento ng UI. - Canvas
#f5f5f7— Mga salit-salit na background ng seksyon - isang kulay abong guhit na naghihiwalay sa mga puting bahagi. - Paper
#ffffff— Ibabaw ng card, background ng pangunahing pahina, teksto ng button sa madilim na background.
Tipograpiya
mula 12 hanggang 96px · 10 hakbang
- SF Pro Display — kapalit: Inter · mga balangkas 600, 700 · Mga pangunahing heading at subheading para sa display — 700 weight sa 80–96px na may negative letter spacing na -1.44px na lumilikha ng signature ng Apple na "napakalaking headline na lumulutang sa puti." Mga pamalit: Inter, system-ui
- SF Pro Display — kapalit: Inter · mga balangkas 600 · Mga pamagat ng seksyon, pamagat ng kard, mga subheading - ang isang 600 na font na may bahagyang positibong pagitan ng mga letra ay mainit at palakaibigan sa katamtamang laki, hindi tulad ng maiikling heading sa itaas.
- SF Pro Text — kapalit: Inter · mga balangkas 400, 500, 600 · Para sa body text, nabigasyon, mga sumusuportang talata, at maliliit na caption, ang pangunahing font ay isang font na may index na 400 sa 17px. Ang negative letter spacing ay nagbibigay-daan para sa mas maigsi at maigsi na pangunahing teksto sa mga pahinang maraming impormasyon.
Mga pagitan at anyo
| Layunin | Kahulugan |
|---|---|
| Densidad | siksik |
| Pangunahing hakbang | 8-10px |
| Radius ng buton | 980px |
| Radius ng card | 28px |
| Mga anino | walang - mga hangganan sa halip na mga anino |
| Sa pagitan ng mga seksyon | 100-120px |
| Lapad ng pahina | 1200px |
Gagawa ang AI ng website mo sa estilong Apple (España) at pupunuin ito
- Punuin ng mga produkto at post gamit ang link - Instagram, TikTok, Facebook.
- Maglipat ng nilalaman mula sa iyong lumang site—tukuyin lamang ang address.
- Modernong disenyo gamit ang pinakamahusay na engine: React ( Next.js) na may kasamang server rendering at SEO optimization na agad-agad.
- Ganap na awtomatikong pag-optimize ng SEO para sa mga resulta ng paghahanap at mga rekomendasyon sa neural network.
Mga katulad na estilo
- Airbnb — Isang tahimik na puting gallery wall na may isang coral red bookmark
- Peak Design — Pader ng gallery, bahagyang naiilawan
- Ramp — Ang departamento ng pananalapi ng editoryal, mga itim at puting pahina na may iisang neon marker. Ang halos monochrome na ibabaw ng publikasyon, kung saan ang isang matingkad na berdeng guhit ay binabago ang bawat interaksyon tungo sa isang hudyat ng pera.
- 099 SUPPLY — Isang gallery wall na puno ng mga itim at puting bagay
- Orderful — Industrial Logistics Control Deck - Isang naka-print na checklist ng logistics dispatcher, na gawa sa itim na tinta at surgical red, ang bawat pahina ay sapat na maingat upang payagan ang isang operator na isigaw ang isang bagay na mahalaga.
- Apple (España) — puting display case ng gallery
- teenage engineering — Katalogo ng industriya sa pag-iilaw ng studio - ang produkto ang tanging mahalagang bagay sa pahina, at lahat ng iba pa ay tinatalakay sa paligid nito
- Apple (España) — Isang bintana ng gallery sa hamog sa umaga
- Lightship — Isang sinematikong diorama ng malawak na kalsada. Mainit at kremang mga dingding ng gallery na pinalamutian ng malalaking litrato ng tanawin na nakakabit nang malapitan, manipis na itim na tipo na halos hindi makita sa mga frame, at isang matingkad na kulay kahel na accent na bumabasag sa monochrome na parang siga sa parang.
- Custo — Isang gallery na kulay gunmetal na may monolitikong font. Isang showroom sa mahinang kulay abo-berde, kung saan ang isang madilim na bagay at 57px na font ay nagsasalita para sa kanilang sarili.
- Silencio — Isang puting silid na may mga lumulutang na artifact. Isang gallery display na gawa sa mainit na papel, kung saan ang bawat elemento ay pumuwesto laban sa isang negatibong backdrop ng volume, at ang katahimikan ay isang sinadyang desisyon sa disenyo.
- ORYZO AI — Isang sanaysay tungkol sa isang madilim na silid. Isang nag-iisang bagay na nakalutang sa mainit na dilim, kulay krema ang tanging palamuti.