Authkit
Төн уртасында бозлы пыяла соборы
AuthKit төнге продукт презентациясе эстетикасын булдыра: бозлы пыяла өслекләре, күренми торган сызыклар челтәре һәм пыяла катламы белән яктыртылган кебек күренгән ялтыравыклы текст белән капланган кара төстәге холст. Шрифт караңгы фонда тулысынча диярлек ак төстә, бердәнбер функциональ элемент буларак бер генә ачык шәмәхә төстәге акцент кулланыла - һәр интерактив өслектә каты рамка түгел, ә салкын зәңгәр-ак төстәге йомшак, нечкә сызык бар. Компонентлар үтә күренмәле катламнарда урнаштырылган, алар тирә-юньдәге яктылык өстенә катламланган, һәм карточкалар кәгазь панельләр урынына астан яктыртылган пыяла пластиналар кебек күренә. Ара зур һәм ритмик; төп элемент - битнең бөтен киңлеген колачлаган, традицион бүленгән экран макеты урынына йөзүче пыяла карточкалар белән әйләндереп алынган бер яктыртылган логотип.
Тулы киңлектәге, караңгы төстәге, үзәкләштерелгән эчтәлек контейнеры белән, максимум 1200 пиксель киңлектә. Төп элемент - кечкенә каш формасындагы текст астында бер үзәкләштерелгән, яктыртылган логотип (градиент шрифтында "AuthKit"), аның артында/аста логин формасы җилләткече белән өч йөзүче пыяла карта урнашкан (сул карта сулга авышкан, үзәк карта зурайтылган, уң карта уңга авышкан). Ачык/караңгы тема күчергече төп элемент астында үзәкләштерелгән. Функцияләр рәте - түгәрәк иконалар арасында нечкә тоташтыручы сызыклары булган 6 иконкадан торган горизонталь вакыт сызыгы. Бүлек ритмы: һәр бүлек сүнә торган горизонталь сызыклар белән рамкаланган үзәкләштерелгән каш формасындагы текст белән башлана, аннан соң зур, үзәкләштерелгән исем (44-48 пиксель), аннан соң бер юл тавышсыз текст (16-18 пиксель), максимум киңлек ~640 пиксель. "Көйләү" бүлегендә үзәктә урнашкан логин картасы булган браузер тәрәзәсенең макеты күрсәтелә, ул йөзүче UI инспектор панельләре (төс палитралары, радиус слайдерлары, логотип иконасын сайлаучы, төймә текст кыры, бит фоны кыры) белән әйләндереп алынган, дизайн кораллары эш мәйданы кебек, холст почмакларында урнашкан.
Визуаль дизайнда "пыяла морфологиясе" стилендә эшләнгән (электрон почта/серсүз кертү кырлары, социаль медиа керү төймәләре, серсүзсез код кертү), йөзүче, үтә күренмәле карталар рәвешендә төнге полотнога куелган логин формалары макетлары өстенлек итә. Функция иконкалары - түгәрәк, мат плиткалар эчендә #d1e4fa белән монохром сызыклы глифлар. Нечкә челтәр (rgba (186,215,247,0.06) белән 1 пиксель сызыклар) бөтен битне каплап ала, атмосфера тудыра, ә төп элементның өске өлешендә конус градиентлы прожектор ялтырап тора. Фотосурәтләр юк, яшәү рәвеше рәсемнәре юк, продукт скриншотлары юк - продукт үзе визуаль элемент: караңгы студиядә пыяла прототиплар кебек урнаштырылган логин кырлары.
Палитра
Бренд
- Void Violet
#663af3— Гамәлгә чакыру (CTA) төймәсе өчен төп төс - керү формаларында "Дәвам итү/Җибәрү" төймәсе өчен генә кулланыла торган бердәнбер акцент төсе; кара төскә якын фондагы якты шәмәхә төс монохроматик төс схемасын бозмыйча, ашыгычлык хисе тудыра.
Нейтраль
- Midnight Canvas
#05060f— Битнең фоны, открытканың иң тирән өслеге, бейджикның эчлеге — башка бар нәрсә йөзеп торган диярлек кара нигез. - Steel Plate
#2f343e— Күтәрелгән өслек, фантом/икенчел хәрәкәт төймәләре, сизелмәс панель арткы өлеше. - Fog Veil
#9da7ba— Төп текстны, карточкадагы текстны, укырга мөмкин, ләкин исемнәр белән чагыштырганда, фонга күчерелгән. - Moon Mist
#c7d3ea— Төп текст, өстәмә ярлыклар, тавышсыз ярдәмче текст - Frost Glow
#d1e4fa— Төп һәм сылтама тексты, иконка тексты һәм иконка тутыру өчен төп тутыру төсе - гадәти рәвештә якты алгы фон. - Ice Highlight
#d8ecf8— Караңгы өслекләрдә ачык текст, кире кайтарылган ярлыклар һәм югары контрастлы башлыклар. Аны чакырулар өчен төп төс итеп кулланмагыз; AuthKit логотибында һәм төп башлыкларда башлык градиенты - ачык зәңгәрдән йомшак зәңгәргә өстән аска шома күчү - кулланыла.
Типография
12 дән 48 пиксельгә кадәр · 8 адым
- Untitled Sans — алыштыру: Inter · контурлар 400, 500, 600, 700 · Төп текст, кулланучы интерфейсы, төймәләр, кертү кырлары, иконалар, кечкенә башлыклар - барлык функциональ функцияләр өчен универсаль шрифт.
- aeonikPro — алыштыру: Space Grotesk · контурлар 400, 500 · Бары тик башлыкларны гына күрсәтү — AuthKit брендингын, бүлек башлыкларын һәм төп текстны — 44-48 пиксель зурлыгындагы 500 пунктлы шрифт брендингка ялтыравыклы акцент урынына киң, тыйнак күренеш бирә.
- dotDigital — алыштыру: JetBrains Mono · контурлар 400 · Баш хәрефләр белән язылган текст ("Таныштыру", "Киңәйтелә торган дизайн", "Якты балкыш") - 0,10 мм ара калдырылган бер интерваллы баш хәрефләр белән язылган текст төп текст һәм башлык арасында нечкә аергыч булып хезмәт итә.
Интерваллар һәм форма
| Максат | Мәгънәсе |
|---|---|
| Тыгызлык | киң |
| Төп адым | 16px |
| Төймә радиусы | 999px |
| Карта радиусы | 16px |
| Күләгәләр | күләгәләр урынына чикләр юк |
| Бүлекләр арасында | 120px |
| Бит киңлеге | 1200px |
Ясалма интеллект сезнең сайтны Authkit стилендә төзер һәм аны тутырыр
- Продуктлар һәм постлар белән Instagram, TikTok, Facebook сылтамасы аша тутырыгыз.
- Иске сайтыгыздан контентны күчерегез — адресны күрсәтегез генә.
- Иң яхшы двигательдә заманча дизайн: сервер рендерингы һәм SEO оптимизациясе белән React ( Next.js).
- Эзләү нәтиҗәләре һәм нейрон челтәр тәкъдимнәре өчен тулысынча автоматик SEO оптимизациясе.
Охшаш стильләр
- Resend — кара бәрхет белән шәмәхә неон төсе
- Gsap — Дизайн студиясендә анимацияләнгән ак такта. Кара төстәге дивар, җылы каймак акбур һәм биш төсле маркер - һәр анимация дисциплинасы өчен берәр.
- Slash — Алтын белән бизәлгән дәфтәрләр белән төнге сейф
- Raycast — Төн уртасы команда үзәге, Корал Неон
- Dimension — караңгыда яктыртылган эш урыны, бозлы пыяла панельләр
- Modal — Караңгы сервер бүлмәсендәге фосфоресцент терминал - бердәнбер яктылык чыганагы - якты яшел төс
- Reflect Notes — Йолдызлы шәмәхә киңлек - караңгы обсерватория, анда ноталар йолдызлыклар кебек йөзеп йөри, диярлек кара индиго бушлыгы фонында.
- LaunchDarkly — Неон белән идарә итү бүлмәсе - караңгы кабина, анда кара панельләр аша шәмәхә төстәге сигналлар күчә.
- Ameba — Төн уртасында идарә итү бүлмәсе – бозлы пыяла панельләр эчендә электр зәңгәр пульсы
- AgentQL — Төнлә терминал өстендә төньяк балкышлары
- Neon — Караңгы төшкәннән соң сервер бүлмәсе. Саф караңгылык, анда яктылык бары тик мәгълүматлардан һәм кулланучылар белән аралашудан гына килә.
- N8n — Төн уртасындагы эш процессы механизмы – караңгы сервер бүлмәсендә реаль вакыт режимындагы автоматизация холсты хисе, статус күрсәткечләре һәм мәгълүмат агымнары белән яктыртылган