Authkit
Katedrála z matného skla o půlnoci
AuthKit vytváří estetiku noční produktové prezentace: téměř černé plátno s matnými skleněnými povrchy, mřížku sotva viditelných čar a zářící text, který se jeví jako osvětlený skleněnou vrstvou. Písmo je téměř celé bílé na tmavém pozadí s jediným jasně fialovým akcentem jako jediným funkčním prvkem – každá interaktivní plocha má měkkou, tenkou linii chladné modrobílé barvy namísto pevného rámu. Komponenty jsou uspořádány na průsvitných vrstvách, navrstvených přes okolní záři, a karty se jeví jako skleněné desky osvětlené zespodu, nikoli jako papírové panely. Rozestupy jsou velké a rytmické; hlavním prvkem je jedno osvětlené logo rozprostírající se po celé šířce stránky, obklopené plovoucími skleněnými kartami, namísto tradičního rozvržení s rozdělenou obrazovkou.
Tmavé plátno o plné šířce s centrovaným kontejnerem obsahu, max. šířka 1200 pixelů. Hlavním prvkem je jedno, centrované, osvětlené logo („AuthKit“ v gradientním písmu) pod malým textem ve tvaru obočí, za ním/pod nímž se nacházejí tři plovoucí skleněné karty s přihlašovacím formulářem (levá karta nakloněná doleva, středová karta maximalizovaná, pravá karta nakloněná doprava). Přepínač světlého/tmavého tématu je umístěn uprostřed pod hlavním prvkem. Řadek funkcí je horizontální časová osa 6 ikon s tenkými spojovacími čarami mezi kruhovými ikonami. Rytmus sekcí: každá sekce začíná centrovaným textem ve tvaru obočí orámovaným slábnoucími vodorovnými čarami, následovaným velkým, centrovaným názvem (44–48 pixelů) a následně jedním řádkem tlumeného textu textu (16–18 pixelů), maximální šířka ~640 pixelů. Sekce Přizpůsobit zobrazuje maketu okna prohlížeče s centrálně umístěnou přihlašovací kartou obklopenou plovoucími panely inspektoru uživatelského rozhraní (barevné palety, posuvníky poloměru, selektor ikon loga, textové pole tlačítek, pole pozadí stránky) umístěnými v rozích plátna, podobně jako pracovní plocha návrhových nástrojů.
Vizuálnímu designu dominují makety přihlašovacích formulářů, vytvořené ve stylu „skleněné morfologie“ (pole pro zadávání e-mailu/hesla, tlačítka pro přihlášení k sociálním médiím, zadávání kódu bez hesla), prezentované jako plovoucí, průsvitné karty na pozadí půlnočního plátna. Ikony funkcí jsou černobílé lineární glyfy v barvě #d1e4fa uvnitř kulatých, matných dlaždic. Celou stránku pokrývá jemná mřížka (1px čáry v rgba(186,215,247,0.06)) a vytváří atmosféru, zatímco v horní části hlavního prvku se třpytí kuželovitý gradientní bodový reflektor. Žádné fotografie, žádné obrázky životního stylu, žádné screenshoty produktů – samotný produkt je vizuálním prvkem: přihlašovací pole uspořádaná jako skleněné prototypy v tmavém studiu.
Paleta
Značka
- Void Violet
#663af3— Primární barva tlačítka s výzvou k akci (CTA) je jedinou akcentovou barvou používanou výhradně pro tlačítko „Pokračovat/Odeslat“ v přihlašovacích formulářích; zářivá fialová na téměř černém pozadí vytváří pocit naléhavosti, aniž by narušovala monochromatické barevné schéma.
Neutrální
- Midnight Canvas
#05060f— Pozadí stránky, nejhlubší povrch karty, výplň odznaku – téměř černý základ, na kterém se všechno ostatní vznáší. - Steel Plate
#2f343e— Zvýšený povrch, tlačítka pro fantomové/sekundární akce, diskrétní zadní strana panelu. - Fog Veil
#9da7ba— Hlavní text, text na kartě, je čitelný, ale ve srovnání s nadpisy je odsunut do pozadí. - Moon Mist
#c7d3ea— Hlavní text, další popisky, ztlumený pomocný text - Frost Glow
#d1e4fa— Primární barvou výplně pro text těla a odkazu, text ikon a výplň ikon je výchozí zářivé popředí. - Ice Highlight
#d8ecf8— Světlý text na tmavých površích, invertované popisky a nadpisy s vysokým kontrastem. Nepoužívejte ji jako primární barvu pro výzvy k akci; v logu AuthKit a klíčových nadpisech se používá gradient nadpisu – plynulý přechod ze světle modré do měkké modré odshora dolů.
Typografie
od 12 do 48 pixelů · 8 kroků
- Untitled Sans — nahrazení: Inter · obrysy 400, 500, 600, 700 · Hlavní text, uživatelské rozhraní, tlačítka, vstupní pole, ikony, malé nadpisy - univerzální písmo pro vše funkční.
- aeonikPro — nahrazení: Space Grotesk · obrysy 400, 500 · Zobrazují se pouze nadpisy – branding AuthKit, nadpisy sekcí a text – a písmo o velikosti 500 bodů s rozlišením 44–48 pixelů dodává brandingu široký a decentní vzhled, nikoli okázalý akcent.
- dotDigital — nahrazení: JetBrains Mono · obrysy 400 · Text psaný velkými písmeny („Úvod“, „Rozšířitelný design“, „Zářte jasně“) – text s pevným řádkováním a velkými písmeny s roztečí 0,10 em slouží jako nenápadné oddělovače mezi textem a nadpisem.
Intervaly a forma
| Účel | Význam |
|---|---|
| Hustota | prostorný |
| Základní krok | 16px |
| Poloměr tlačítka | 999px |
| Poloměr karty | 16px |
| Stíny | ne - okraje místo stínů |
| Mezi sekcemi | 120px |
| Šířka stránky | 1200px |
Umělá inteligence vám vytvoří web ve stylu Authkit a naplní ho
- Doplňujte produkty a příspěvky přes odkaz - Instagram, TikTok, Facebook.
- Přeneste obsah ze starého webu – stačí zadat adresu.
- Moderní design na nejlepším enginu: React ( Next.js) s renderováním na serveru a SEO optimalizací ihned po vybalení.
- Plně automatizovaná SEO optimalizace pro výsledky vyhledávání a doporučení neuronových sítí.
Podobné styly
- Resend — černý samet s fialovou neonovou barvou
- Gsap — Animovaná bílá tabule v designovém studiu. Téměř černá zeď, teplá krémová křída a pět barevných fixů – jeden pro každou animační disciplínu.
- Slash — Půlnoční trezor se zlacenými účetními knihami
- Raycast — Půlnoční velitelské centrum, Coral Neon
- Dimension — pracovní stanice osvětlená soumrakem s matnými skleněnými panely
- Modal — Fosforeskující terminál v zatemněné serverovně - jediným zdrojem světla je jasně zelená barva
- Reflect Notes — Hvězdně fialový prostor je temná observatoř, kde se tóny vznášejí jako souhvězdí na pozadí téměř černé indigové prázdnoty.
- LaunchDarkly — Neonová řídicí místnost je tmavý kokpit, kde fialové signály pulzují skrz uhlově černé panely.
- Ameba — Řídicí místnost o půlnoci – elektricky modrý puls uvnitř matných skleněných panelů
- AgentQL — Polární záře nad terminálem v noci
- Neon — Serverovna po setmění. Čistá tma, kde jediné světlo pochází z dat a interakcí uživatelů.
- N8n — Workflow Engine o půlnoci – pocit automatizačního plátna v reálném čase v tmavé serverovně, osvětleného stavovými indikátory a datovými toky