Stripe
Глазурланган айнекке индиго сыясы менен жазылган эсеп китеби
Stripe каржы инструменттери үчүн дээрлик монохромдуу тилди колдонот: кочкул көк түстөгү аталыштары бар жумшак, салкын ак полотно, дээрлик эч кандай декоративдик хром элементтери жок жана баскыч, шилтеме же сөлөкөт контуру катары мыйзамдуу түрдө колдонулушу мүмкүн болгон бир гана ачык индиго (#533afd). Типография өзгөчө жука, 300 пункттук салмакка ээ — ал тургай 56 пиксельде да — бул ачык корпоративдик эмес, ишенимдүү түрдө баса белгиленгендей сезилет; тамгалардын аралыгы өлчөмүнүн чоңоюшу менен кескин азаят. Баскычтар кичинекей, төрт бурчтуу (4 пиксель) жана кочкул кызыл толтургучтарды же эң ичке кочкул кызыл контурларды колдонушат. Система көлөкөлөрдү толугу менен качат; тереңдикке бийиктик аркылуу эмес, фон түстөрүн өзгөртүү аркылуу жетишилет (ак → #f8fafd → #e5edf5 → кочкул кызыл түстөр). Бүтүндөй интерфейс бухгалтердик китеп же терминал сыяктуу иштейт: тыгыз маалымат, так сызыктар, бөлүмдөрдүн ортосундагы жетиштүү мейкиндик жана түс бир гана аракет талап кылынганда пайда болот.
Ак полотнодогу борборлоштурулган мазмун тилкеси үчүн максималдуу туурасы ~1320px. Баатыр – бул толук өлчөмдөгү (56px) солго тегизделген тексттик блок, анын астында эки аракетке чакыруу бар, баатырдын сүрөтү жок – типография – бул баатыр. Бөлүмдөр бирдей 96px науалары жана 1px #e5edf5 бөлгүчтөрү менен тигинен жайгаштырылган; кезектешип турган караңгы/ачык сызыктар жок. Ар бир бөлүм кайталануучу үлгүгө ылайык келет: бардык баш тамгалар менен жазылган кичинекей бөлүмдүн аталышы (түтүндүү түс, 12px), андан кийин 32-48px аталышы, андан кийин 22px абзац, андан кийин продукт карталарынын торчосу (иш столунда 3 тилке) же визуалдык искусствосу бар 2 тилкелүү тексттик блок. Кардардын логотиптери солго тегизделген кууш вертикалдуу тилкеде пайда болот. Төмөнкү колонтитул – шилтемелердин көп тилкелүү тизмелери бар бир кең #f8fafd тилкеси. Жалпы ритм жай, өлчөмдүү жана негизинен тексттик – маалыматтын тыгыздыгы узун жылдыруу узундугуна карабастан төмөн.
Сүрөттөр чектелген жана даректүү стилде. Толук беттеги сүрөттөр кейс-стадилерди камтыган бөлүмдөрдө гана көрсөтүлөт (мисалы, Hertz үчүн абадан тартылган сүрөткө тартуу), жогору жактан же драмалык бурчтарда тартылган, табигый түстөрдү колдонуу менен — дуэтон же түстөрдү иштетүү жок. Продукциянын колдонуучу интерфейсинин скриншоттору функциялык карталардын ичинде колдонулат, курч бурчтар жана так чек аралар менен, түзмөктүн алкактарысыз көрсөтүлөт. Өнөктөштүн логотиптери өз түстөрүндө, эч кандай контейнерлерсиз көрсөтүлөт. Иллюстрациялар, 3D рендерлер же декоративдик абстракттуу графикалык элементтер жок. Иконалар бирдей: ак фондо 1-сызык калыңдыгы, 2-сызык калыңдыгы, геометриялык сызык искусствосу (шеврондор, жебелер, белгилөөчү белгилер, документ символдору). Барак негизинен тексттен жана ак мейкиндиктен турат; сүрөттөр жалпы визуалдык аянттын 3% дан азын ээлейт.
Түстөр палитрасы
Бренд
- Indigo Ink
#533afd— Кызгылт көк түс толтурулган баскычтар, тандалган навигация абалдары жана фокуска багытталган конверсия моменттери үчүн колдонулат. - Indigo Hover
#7389ff— Кызгылт көк түс шилтемелерди, тегдерди жана кыска сөз айкаштарын белгилөө үчүн колдонулат. Аны аракетке чакыруу үчүн негизги түс катары колдонбоо керек.
Нейтралдуу
- Midnight Ink
#061b31— Негизги аталыш жана негизги текст терең, дээрлик кара түстө жана муздак көк түстө болуп, бүтүндөй шрифт системасынын негизи болуп кызмат кылат. - Slate
#64748d— Боз текст шилтемелерди, тегдерди жана кыска сөз айкаштарын баса белгилейт. - Steel
#50617a— Кошумча текст жана кошумча материалдар сублицензияларда колдонулган сланец менен үнсүз кочкул кызыл түстөрдүн ортосуна жайгаштырылган. - Smoke
#839bc8— Чоң декоративдик аталыштар жана коштомо тексттер үчүн күңүрт кочкул кызыл түс колдонулат - эч качан негизги абзацтарда колдонулбайт. - Pure White
#ffffff— Барактын холст жана карталардын көтөрүлгөн беттери; калганынын баары өлчөнгөн демейки фон. - Mist
#f8fafd— Төмөнкү колонтитулдун фоны жана бөлүм бөлгүчү көрүнүктүү чек арасы жок аймактарды бөлүп турган жумшак муздак көлөкө болуп саналат.
Типография
12ден 56 пикселге чейин · 9 кадам
- sohne-var — алмаштыруу: Inter Tight (variable · контурлар 300, 400 · Бүтүндөй интерфейсте колдонулган жалгыз шрифт - бул аталыштар, негизги текст, навигация, баскычтар жана энбелгилер. 300 калыңдыгы 56 пиксель экран өлчөмүндө да басымдуулук кылат, бул өзгөчөлүк: аталыштар кыйкыруунун ордуна шыбырап, үндүн катуулугу менен эмес, чектөө аркылуу бийликти орнотот. 400 калыңдыгы навигация жана баскыч тексти үчүн 14–16 пиксельде гана көрүнөт, ал эми кичирээк өлчөмдөрдө окумдуулугу үчүн кошумча сызык талап кылынат.
Интервалдар жана форма
| Максаты | Мааниси |
|---|---|
| Тыгыздык | кенен |
| Негизги кадам | 8px |
| Баскычтын радиусу | 4px |
| Картанын радиусу | 4px |
| Көлөкөлөр | көлөкөлөрдүн ордуна чек аралар жок |
| Бөлүмдөрдүн ортосунда | 96px |
| Барактын туурасы | 1320px |
Жасалма интеллект сиздин веб-сайтыңызды Stripe стилинде куруп, аны толтурат
- Instagram, TikTok, Facebook шилтемелери аркылуу өнүмдөр жана посттор менен толтуруңуз.
- Эски сайтыңыздан мазмунду өткөрүп бериңиз — жөн гана даректи көрсөтүңүз.
- Эң мыкты кыймылдаткычтагы заманбап дизайн: серверди рендеринг жана SEO оптималдаштыруу менен React ( Next.js).
- Издөө натыйжалары жана нейрон тармактарынын сунуштары үчүн толугу менен автоматташтырылган SEO оптималдаштыруу.
Окшош стилдер
- Ui — күңгүрт кагаздагы клиникалык план
- monopo saigon — Редакциялык жымжырттыктын артындагы суюк, иридес жаркыроо — эриген жарыкта калкып жүргөн монохром редакциялык галерея
- Ventriloc — Жылуу кагаздагы маалыматтардын редакциялык обсерваториясы - монохромдук тактыкты баса белгилеген бир кызгылт сары чок
- Hyer Aviation — Пергаменттин үстүндө кабинада күүгүм кирип турат. Кубарыңкы таңкы асман фюзеляждын өлчөмүндөгү сериф логотиби менен кагылышып, жылуу чопо түстөгү бир гана акцент монохромдук кармагычты бузат.
- Family — Каймак пергаментке жазылган жомоктон үзүндү
- OFF+BRAND. — Жылуу пергаменттеги жаркыраган шар
- Geniestudio — Жумшак күндүзгү дептер — кең четтери жана бир калың калеми бар түрү
- xAI — Кара таблетка кошулган жылуу крем лабораториясы
- Seed — лабораториялык айнектин астындагы тирүү организм
- Cosmos — Зыгыр кездеме менен капталган жана Полароиддер менен кооздолгон галереянын дубалы
- Cal — Монохромдук практикалуулук, адамдык мамиле. Катуу кара жана ак палитра аркылуу тактыкка жана функционалдуулукка артыкчылык берген, бирок аны ыңгайлуу типография жана тегеректелген формалар менен жумшарткан система.
- T1 Energy — Жылуу пергаментке түшүрүлгөн өндүрүш жайынын сүрөтү – бул тынч, монохромдуу көрүнүш, анда өнөр жай масштабы жана назик типография бүтүндөй брендди чагылдырат.