
Linear
instrumentong may katumpakan sa hatinggabi
Ang Linear design system ay isang nocturnal command center na itinayo sa halos itim na mga ibabaw (#08090a) na may crisp white na tipo at isang lime-green na accent (#e4f222) na gumagana bilang isang functional flashlight—maliit, mataas ang contrast, at ginagamit nang matipid upang ipahiwatig ang mga aksyon. Itinuturing ng interface ang kadiliman bilang isang pundasyon sa halip na isang tema: ang teksto ay crisp white na may masikip na letra-spacing (-0.022em), ang font weights ay nasa mababang 400–510 range sa halip na bold, at ang mga border ay ultra-thin (0.5px) upang hayaan ang geometry na gawin ang trabahong karaniwang ginagawa ng mga anino. Ang mga bahagi ay parang eksaktong pagkakagawa—6px at 12px radii, compact na 8–12px margins, at halos kumpletong kawalan ng mga pandekorasyon na elemento—na nagpapahintulot sa product UI (task cards, Kanban boards, AI agent panels) na maging tanging visual texture sa isang sistemang kalmado naman.
Ang layout ay may maximum na lapad na humigit-kumulang 1200px, nakasentro, na may madilim na background na umaabot hanggang sa mga gilid ng viewport. Ang pangunahing elemento ay isang malaking headline, nakahanay sa kaliwa (64–72px), na ipinares sa isang call to action (CTA) na nakahanay sa kanan, na sinusundan ng isang malaking screenshot ng produkto na bahagyang lumalagpas sa maximum na lapad. Ang ritmo ng mga seksyon ay nagpapalitan sa pagitan ng mga komposisyon na may dalawang hanay na may teksto sa kaliwa at isang imahe sa kanan, at mga full-width na display strip ng produkto na pinaghihiwalay ng 96px na patayong gutter. Ang strip na may logo ng kliyente ay isang pahalang na hilera. Ang pahina ay hindi kailanman gumagamit ng mga grid ng card na may tatlong hanay o mga naka-tile na istruktura—ang densidad ng impormasyon ay nananatiling mababa, kung saan ang karamihan sa mga seksyon ay gumagamit ng sapat na puting espasyo at isang focal element sa screen. Ang nabigasyon ay isang nakapirming top bar na may logo na nakahanay sa kaliwa at mga link na nakahanay sa kanan, nang walang sidebar o mega-menu.
Ang visual language ng Linear ay batay sa mga screenshot ng produkto: ang mga ilustrasyon sa simula at sa mga seksyon ay mga totoong larawan ng user interface ng Linear app, na nakuha nang detalyado—mga task card, Kanban board, AI agent dashboard, command palette—na nakalagay sa mga manipis na naka-frame na frame. Walang mga stock na larawan, walang mga larawan ng lifestyle, walang mga abstract na ilustrasyon. Ang mga logo ay ipinapakita bilang isang neutral na gray na guhit (#8a8f98) na may pare-parehong laki para sa mga customer. Ang mga icon ay mga minimalist na linear na SVG na imahe sa isang monochromatic gray scale. Ang screenshot sa itaas ng pahina ay lumulutang sa isang banayad na linear gradient (mula madilim hanggang maliwanag), na lumilikha ng lalim ng atmospera nang hindi gumagamit ng mga totoong landscape. Ang bawat visual na elemento ay isang functional na elemento ng produkto mismo.
Paleta
Tatak
- Acid Lime
#e4f222— Ang mga pangunahing button ng kontrol at mga aktibong indicator ng nabigasyon ay isang maliwanag na tuldik na sumisira sa scheme ng kulay ng monochrome.
Neutral
- Mist
#d0d6e0— Mga pangalawang heading, teksto ng buton sa madilim na mga ibabaw - Void
#08090a— Canvas ng pahina, full-width na larawan sa background - bilang default, lahat ng elemento ay inilalagay sa background na ito. - Carbon
#0f1011— Ang mga ibabaw ng card, mga navigation bar, ay isang hakbang sa itaas ng canvas para sa paglalagay ng nilalaman sa loob ng mga card. - Obsidian
#161718— Mga nakataas na ibabaw, mas malalalim na mga panel ng karton - Graphite
#23252a— Mga banayad na hangganan, panghiwalay, banayad na balangkas ng butones – mga gilid na may mababang contrast na tekstura - Smoke
#383b3f— Ang mga manipis na hangganan ay may mas mataas na contrast kaysa sa mga graphite-section separator.
Tipograpiya
mula 13 hanggang 72px · 8 hakbang
- Inter Variable — kapalit: Inter (variable) · mga balangkas 300, 400, 510, 590 · Pangunahing UI at Font ng Header - Ginagamit sa nabigasyon, katawan ng teksto, mga heading, mga buton, at mga kard.
- Berkeley Mono — kapalit: JetBrains Mono · mga balangkas 400 · Teksto ng UI na katabi ng code - mga tagatukoy ng paglabas (ENG-2703), mga shortcut sa keyboard, metadata ng font na monospace
Mga pagitan at anyo
| Layunin | Kahulugan |
|---|---|
| Densidad | maluwang |
| Pangunahing hakbang | 8px |
| Radius ng buton | 6px |
| Radius ng card | 12px |
| Mga anino | walang - mga hangganan sa halip na mga anino |
| Sa pagitan ng mga seksyon | 96px |
| Lapad ng pahina | 1200px |
Gagawa ang AI ng website mo sa estilong Linear 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
- Aaru — Obserbatoryo ng Particle Field sa Hatinggabi
- Atlas Card — Ang Midnight Vault, kasama ang nag-iisang sinag ng sapiro, ay isang madilim na kalawakan kung saan ang tanging mahalaga ay ang malalim na electric blue.
- Checkly — Sentro ng Pagkontrol ng Misyon sa Malalim na Orbita
- Savee — Itim na Kanbas para sa mga Biswal na Kurator
- Inngest — Isang madilim at tahimik na obserbatoryo, na may kagamitan para sa pagtatrabaho gamit ang mga instrumento, na iniilawan ng isang kulay amber na pilot light
- Dala — isang konstelasyon na nakalutang sa itim na pelus
- Origin Financial — Isang hatinggabi na galeriya ng tahimik na karangyaan. Isang tahimik, halos madilim na silid kung saan ang malalaking serif font at ilang maliwanag na kulay na mga panel ay lumilikha ng pakiramdam na ang pananalapi ay isang maingat na inayos na likhang sining.
- Hyperstudio — Ang disenyo ay nakaukit sa obsidian. Ang teksto at mga pinong linya ay nakabalangkas sa isang puting espasyo ng purong itim, na may paminsan-minsang ginintuang marka ng compass na nagpapahiwatig ng daan.
- Air — eskultura na "Hatinggabing Langit sa Pamamagitan ng Salamin"
- Resend — itim na pelus na may lilang kulay neon
- Raycast — Sentro ng Pamumuno sa Hatinggabi, Coral Neon
- Dimension — isang workstation na naliliwanagan ng takipsilim na may mga panel na may frosted glass