
Ciridae
Pusty pokój, w którym pulsują tlące się węgle - niemal czarna katedra, w której jedynym ciepłym dźwiękiem jest cienka linia rdzy, a każda powierzchnia jest zdefiniowana przez cienkie linie, a nie cień.
Ciridae działa w próżni: płótno #0b0b0b, kontrolki w kształcie pigułki z ledwo zauważalnymi konturami i typografia zamknięta w wielkich literach Pragmatica Cond o grubości 400 – bez pogrubień, mieszanych wielkich i małych, ani elementów dekoracyjnych. Jedynym akcentem chromatycznym jest #cc6437, ciepły, tlący się odcień rdzy, używany jako najcieńsze kreski i drobne akcenty interpunkcyjne, nigdy jako wypełnienie. Mapy unoszą się na #272a2a o promieniu 10 pikseli i bez cieni; system unika wzniesień, definiując powierzchnie poprzez kontrast tonalny i najdelikatniejsze obramowania o grubości 1 piksela. Fotografie są mocno rozmyte i nastrojowe – płynny marmur, dym, ogień – umieszczone za tekstem w trybie pełnoekranowym, przez co obrazowanie wizualne wydaje się bardziej nastrojowe niż ilustracyjne.
Układ strony jest na całej szerokości, z treścią wyśrodkowaną w granicach ~1400 px. Bohater to ciemna kompozycja o pełnej szerokości z wyśrodkowanym logo konstelacji, flankowanym mikroetykietami po lewej i prawej stronie. Sekcje układają się naprzemiennie: ciemny bohater → jasny pasek z podkładami (Kość) → ciemny tekst transformacji → ciemna siatka kart systemowych → ciemna stopka. Pojedyncza jasna sekcja tworzy pojedyncze, ostre przejście tonalne. Siatka kart składa się z 4 kolumn, przy czym pierwsza karta jest około dwa razy szersza niż pozostałe trzy, co tworzy asymetryczny układ z naciskiem na treść. Pionowa przestrzeń między sekcjami jest duża (ponad 80 px). Nawigacja jest minimalna: górny pasek wiadomości + jeden przycisk „Rozpocznij teraz” wyrównany do lewej i „Menu” wyrównany do prawej na górnym pasku. Brak paska bocznego, brak megamenu.
Nastrojowe fotografie, zajmujące całą powierzchnię strony, dominują na ekranie głównym i kartach. Obrazy są mocno rozmyte (wykryto wartości rozmycia tła na poziomie 50 i 40 pikseli) i charakteryzują się wysokim kontrastem, przedstawiając płynny marmur z niebiesko-czerwonymi zawijasami, dym, ciemne sylwetki krajobrazów oraz tekstury ognia/żaru. Fotografie są nastrojowe i ciemne, a nie żywe – mają tę samą gamę tonalną co puste płótno, zamiast się na nim wyróżniać. Nie ma zdjęć produktów, osób ani zrzutów ekranu interfejsu. Zdjęcia tworzą atmosferę, a nie służą jako treść ilustracyjna. Siatka kart odwzorowuje każdy system na inną scenę atmosferyczną, dzięki czemu fotografie pełnią funkcję abstrakcyjnych identyfikatorów wizualnych, a nie dosłownych obrazów produktów.
Paleta
Marka
- Ember Rust
#cc6437— W systemie monochromatycznym jedynym kolorem chromatycznym są akcenty, linie ikon i niewielkie wyróżnienia tekstu, które wyglądają raczej jak ledwo zauważalne pulsujące punkty niż jako wypełnienie.
Neutralny
- Void Black
#0b0b0b— Obrazy tła dla strony głównej i sekcji, podstawa całego systemu. - Charcoal Surface
#272a2a— Tła wykonane z tektury i paneli na ciemnych obszarach są o jeden ton jaśniejsze od płótna, co pozwala na oddzielenie powierzchni bez cieni. - Bone
#edebe7— Jasne obszary tła i powierzchni mają kolor kremowy, w miejscach, gdzie układ przechodzi z ciemnego w jasny. - Bone Darker
#dfddd9— Delikatny odcień o nazwie „Bone” przeznaczony do wielowarstwowych jasnych powierzchni i elementów o ciepłej, niemal białej barwie. - Pure White
#ffffff— Wszystkie główne teksty i nagłówki, obramowania przycisków i elementy nawigacyjne są w kolorze podstawowym ze współczynnikiem kontrastu 19,7:1 na czarnym tle Void. - Abyss
#050505— Podniesione tło paska informacyjnego (górny pasek informacyjny) - o jeden odcień ciemniejsze niż główne płótno, aby pasek się wyróżniał.
Typografia
od 11 do 32px · 5 kroków
- Pragmatica Cond — wymiana: Oswald · wytyczne 400 · Podstawowym fontem wyświetlacza i interfejsu użytkownika jest wąska, skondensowana czcionka z 14 px wielkimi literami w tekście głównym, 20 px w nagłówkach sekcji i 32 px w tekście głównym. Niezwykle wąska czcionka i 14 px wielkimi literami w tekście głównym to najbardziej charakterystyczne rozwiązanie dla systemu: tekst główny czyta się jak szept czcionki architektonicznej, a nie jak zwykłą prozę. Jeśli Pragmatica Condensed jest niedostępna, należy zastąpić ją czcionką Oswald lub Barlow Condensed.
- Pragmatica — wymiana: Inter · wytyczne 400 · Czcionka drugorzędna, podstawowa używana w dłuższych fragmentach prozy (np. opis karty „System operacyjny AI” ma szerokość 24 px, a tekst akapitu – 15 px). Nieco szersza niż Pragmatica Cond, dla łatwiejszego czytania w większych blokach, ale nadal o grubości 400 px – nigdy pogrubiona. Zastąp ją czcionką Inter lub Söhne.
- Roboto Mono — wymiana: Roboto Mono (free · wytyczne 400 · Czcionka o stałej szerokości dla paska informacyjnego („WIADOMOŚCI • 15 CZERWCA 2026 • WCZESNY DOSTĘP DO CRUCIBLE JUŻ OTWARTY”). Czcionka o stałej szerokości jest używana tylko tutaj, co wyraźnie podkreśla funkcjonalność: to dane systemowe, a nie branding.
Interwały i forma
| Zamiar | Oznaczający |
|---|---|
| Gęstość | przeciętny |
| Podstawowy krok | 16-20px |
| Promień przycisku | 1440px |
| Promień karty | 10px |
| Cienie | nie - granice zamiast cieni |
| Między sekcjami | 80px |
| Szerokość strony | 1400px |
Sztuczna inteligencja zbuduje Twoją witrynę w stylu Ciridae i wypełni ją
- Uzupełnij produktami i postami za pomocą linku - Instagram, TikTok, Facebook.
- Przenieś zawartość ze starej witryny — wystarczy podać adres.
- Nowoczesny design na najlepszym silniku: React ( Next.js) z renderowaniem serwerowym i optymalizacją SEO od razu po wyjęciu z pudełka.
- W pełni zautomatyzowana optymalizacja SEO dla wyników wyszukiwania i rekomendacje sieci neuronowych.
Podobne style
- Dala — konstelacja unosząca się na czarnym aksamicie
- Linear — instrument o precyzji północy
- Resend — czarny aksamit z fioletowym neonowym kolorem
- Dovetail — Plan pod czarnym księżycem – ledwo widoczne linie wykresu, biała czcionka, jeden fioletowy błysk
- Neon — Serwerownia po zmroku. Całkowita ciemność, gdzie jedynym światłem są dane i interakcje użytkowników.
- Discord — Świat gry ukryty jest za wyskakującym okienkiem czatu – każda sekcja to samodzielne środowisko z własnym oświetleniem i zestawem postaci
- Aaru — Obserwatorium Pola Cząstek o północy
- Atlas Card — Krypta Północy, z pojedynczym promieniem szafiru, to czarna jak smoła przestrzeń, w której liczy się tylko głęboki, elektryczny błękit.
- Midjourney — Bioluminescencyjny terminal w głębi oceanu. Głębinowy świat, w którym inteligencja generuje się wizualnie w strumieniach ASCII, a elementy sterujące pojawiają się jako delikatnie świecące wzory.
- Checkly — Centrum Kontroli Misji Głębokiej Orbity
- Krea — galeria noir o północy
- Wope — Wope to interfejs fioletowego horyzontu. Wyobraź sobie ciemny stół obserwacyjny z fioletowym światłem padającym spod szkła.