Stripe
Күңгірт әйнекке индиго сиямен жазылған есеп кітабы
Stripe қаржы құралдары үшін дерлік монохромды тілді пайдаланады: қою көк тақырыптары бар жұмсақ, салқын ақ кенеп, сәндік хром элементтері жоқ дерлік және түйме, сілтеме немесе белгіше контуры ретінде заңды түрде пайдаланылуы мүмкін бір жарқын индиго (#533afd). Типография өте жұқа, 300 нүктелік салмақпен - тіпті 56 пиксельде - бұл ашық корпоративтік емес, сенімді түрде төмендетілгендей сезіледі; әріптер аралығы өлшемі ұлғаюымен күрт азаяды. Түймелер кішкентай, шаршы (4 пиксель) және күлгін толтырғыштарды немесе ең жұқа күлгін контурларды пайдаланады. Жүйе көлеңкелерден толығымен аулақ болады; тереңдікке биіктік арқылы емес, фон реңктерін өзгерту арқылы қол жеткізіледі (ақ → #f8fafd → #e5edf5 → күлгін реңктер). Бүкіл интерфейс бухгалтерлік кітап немесе терминал сияқты жұмыс істейді: тығыз ақпарат, айқын сызықтар, бөлімдер арасындағы кең кеңістік және түс тек әрекет қажет болған кезде ғана пайда болады.
Ақ кенептегі ортаға орналастырылған мазмұн бағанының максималды ені ~1320 пиксель. Батыр - солға қарай тураланған толық өлшемді (56 пиксель) мәтіндік блок, төменде екі әрекетке шақыру бар, батырдың суреті жоқ - типография - батыр. Бөлімдер тігінен 96 пиксельдік науалармен және 1 пиксельдік #e5edf5 бөлгіштермен орналастырылған; кезектесіп тұратын қара/ашық жолақтар жоқ. Әрбір бөлім қайталанатын үлгіні ұстанады: барлық бас әріптермен жазылған кішкентай бөлім атауы (түтінді түс, 12 пиксель), содан кейін 32-48 пиксельдік тақырып, содан кейін 22 пиксельдік абзац, содан кейін өнім карталарының торы (жұмыс үстелінде 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 — Жылы пергаментке салынған өндіріс орнының суреті - тыныш, монохромды көрініс, онда өнеркәсіптік ауқым мен нәзік типография бүкіл брендті бейнелейді.