Resend
чорны аксаміт з фіялетавым неонавым колерам
Resend існуе ў амаль поўнай цемры - чыстае чорнае палатно, тонкія графітавыя рамкі і бела-чорная друкарня, якая стварае адчуванне чытання тэксту, надрукаванага на матавым шкле. Галоўны элемент антыдэкаратыўны: адзін буйны загаловак з засечкамі ў 96px Domaine побач з трохмерным чорным кубам, без градыенту і маркетынгавай ілюстрацыі. Фірмовы знак - насычаны фіялетавы колер (#9281f7), які з'яўляецца ў радках адрасоў электроннай пошты, значках стану і прыкладах кода - ніколі на кнопках. Монашырынны шрыфт (Commit Mono) перадае індывідуальнасць распрацоўніка праз кожны блок кода, значок і ўбудаваную пазнаку, дзякуючы чаму старонка выглядае як тэрмінал, складзены ў раскошны інтэрфейс. Кампаненты маюць вострыя ці злёгку закругленыя куты (6px / 16px), нізкую вышыню і выкарыстоўваюць рамкі 1px замест ценяў для падзелу пластоў. Дынаміка стрыманая, але выразная: плыўнае згасанне і слізгаценне тэксту на галоўным экране, ледзь прыкметнае кручэнне куба з дапамогай WebGL і кароткія 150-мілісекундныя пераходы пры навядзенні курсора.
Візуальнае афармленне амаль цалкам складаецца з 3D-аб'ектаў, адмаляваных з дапамогай WebGL (чорны куб у галоўным акне, якія верцяцца геаметрычныя формы), і ўбудаваных скрыншотаў карыстацкага інтэрфейсу прадукта, якія адлюстроўваюцца ў цёмных вокнах кода. Ніякіх фатаграфій, ілюстрацый, малюнкаў, якія адлюстроўваюць лад жыцця. Лагатыпы ў панэлі даверу - гэта ўбудаваныя SVG-малюнкі ў зыходных колерах. Абразкі - гэта контуры 1px-1.5px з абводкай #f0f0f0 або #a1a4a5. Візуальная мова: чорнае палатно, 3D-аб'ект у якасці якара галоўнага акна, цёмныя вокны кода ў якасці доказу прадукта, белыя SVG-лагатыпы ў якасці сацыяльнага доказу. Нічога дэкаратыўнага - кожны візуальны элемент альбо структурны (куб), альбо дэманстрацыйны (акно кода, лагатып).
Палітра
Брэнд
- Iris Violet
#9281f7— Фіялетавы акцэнт тэксту для спасылак, тэгаў і выдзеленых кароткіх фраз; дыяганальны градыент ад фіялетавага да пурпурнога на кантэйнерах абразкоў і фірмовых значках. - Iris Violet Glow
#baa7ff— Фіялетавым колерам выдзелены спасылкі, тэгі і кароткія выдзеленыя фразы.
Нейтральныя
- Void Black
#000000— Фон старонкі, паверхні кардона, накладныя экраны - усё палатно. - Graphite Hairline
#292d30— Межы 1px на картках, палях уводу, кнопках, блоках кода, падзельніках - вызначаюць кожны падзел пластоў. - White
#ffffff— Асноўныя загалоўкі, загаловак, подпісы да кнопак, заліванне абразкоў на цёмных паверхнях. - Bone White
#f0f0f0— Асноўны тэкст, другарадныя загалоўкі, контуры значкоў - асноўны колер для чытання. - Ash Gray
#a1a4a5— Прыглушаны асноўны тэкст, подпісы значкоў, абводка абразкоў - тэкст трэцяга ўзроўню і метададзеныя. - Smoke Gray
#abafb4— Колер спасылкі, тэкст неактыўнай кнопкі, дапаможныя подпісы - тэкст чацвёртага ўзроўню
Друкарня
ад 12 да 96px · 8 прыступак
- Inter — замена: Inter (Google Fonts) · напісання 400, 500, 600 · Асноўны тэкст, пазнакі карыстацкага інтэрфейсу, рух, кнопкі, спасылкі. Працоўная прылада - сустракаецца 1280 раз на ўсіх паверхнях, акрамя кода.
- Domaine — замена: GT Sectra · напісання 400 · Загалоўны тэкст - шрыфт таўшчынёй 400 з міжлітарным інтэрвалам 96px стварае адчуванне рэдакцыйнага, амаль друкаванага афармлення. Выкарыстоўваецца ўсяго двойчы на ўсёй старонцы для самага буйнога загалоўка.
- aBC Favorit — замена: Inter Display · напісання 400, 500 · Загалоўкі раздзелаў і падзагалоўкі. Фірмовы стыль шрыфта 56px weight-400 з міжлітарнай адлегласцю -0.05em — экстрэмальна адмоўная міжлітарная адлегласць на геаметрычным шрыфце без засечак стварае сціснутае, упэўненае ўражанне ад тэксту, якое кантрастуе з галоўным шрыфтам Domaine.
Інтэрвалы і форма
| Прызначэнне | Значэнне |
|---|---|
| Шчыльнасць | прасторная |
| Базавы крок | 16px |
| Радыус кнопак | 6px |
| Радыус картак | 16px |
| Цені | не - межы замест ценяў |
| Паміж секцыямі | 96px |
| Шырыня старонкі | 1200px |
ІІ збярэ ваш сайт у стылі Resend і напоўніць яго
- Напоўніць таварамі і пастамі па спасылцы — Instagram, TikTok, Facebook.
- Перанясе кантэнт са старога сайта - дастаткова пазначыць адрас.
- Сучасны дызайн на лепшым рухавічку: React ( Next.js) з серверным рэндэрынгам і SEO-аптымізацыяй са скрынкі.
- Поўная аўтаматычная SEO-аптымізацыя пад пошукавую выдачу і рэкамендацыі нейрасетак.
Падобныя стылі
- Neon — Серверны пакой пасля наступлення цемры. Глыбокая цемра, дзе адзінымі крыніцамі святла з'яўляюцца дадзеныя і ўзаемадзеянне паміж карыстальнікамі
- Discord — Гульнявы свет скрыты за ўсплывальным акном чата - кожны раздзел уяўляе сабой самадастатковае асяроддзе са сваім уласным асвятленнем і наборам персанажаў.
- Midjourney — Біялюмінесцэнтны тэрмінал у глыбакаводных раёнах акіяна. Глыбакаводны свет, дзе інтэлект наглядна генеруе сябе ў патоках ASCII, а элементы кіравання выглядаюць як слаба свецяцца ўзоры
- Wope — Wope - інтэрфейс фіялетавага гарызонту. Уявіце сабе цёмны стол у абсерваторыі, з-пад шкла якога паднімаецца фіялетавы светлавы струмень
- Ori — Серверны пакой апоўначы - чорная пустата, белае святло, адзін уключаны выключальнік
- Amaterasu — Нябеснае бірузовае свяцілішча
- Obsidian — Сховішча крышталёвых ведаў. Дакладная, шматгранная лічбавая прастора, створаная для яснасці і засяроджанасці, з зіготкімі фіялетавымі пражылкамі ўзаемадзеяння
- Morphic — Цёмнае кінематаграфічнае палатно для апавядання з дапамогай ІІ. Чысты чорны колер паглынае ўсё, акрамя сіняга пульсацыі аднаго акцэнту і свячэнні згенераванага малюнка
- Valo — Нуарная абсерваторыя апоўначы - друкарка шчыльнасцю 300 пунктаў парыць на чыстым чорным фоне, а адзіны бірузова-фіялетавы градыент праходзіць скрозь пакой, нібы лазерная лінія
- JetBrains — Неонавая туманнасць на абсідыяне - старонка на чорным фоне, дзе фіялетава-сінія градыенты расцвітаюць, нібы выявы глыбокага космасу, перамяжоўваючыся ярка-ружовым неонам і храматычным святлом абразкоў для кожнага прадукту
- beehiiv — паўночная абсерваторыя з неонавай плазмай
- RainbowKit — Неонавы кашалёк-мадальны арганайзер парыць у чорнай пустаце - сіне-фіялетавае ззянне прабіваецца скрозь цемру