Dark by default
The interface and the brand live on near-black surfaces. Light is information: white text, glowing screens, a tiny blue accent. Nothing decorative disrupts the data-heavy feel.
Brand kit
Seek the signal. Everything else is noise.
Gerulata helps you turn complex and noisy online environments into actionable intelligence. This kit is how the brand does the same job visually: one dark surface, light as information, and nothing decorative in the way of the data.
- Version
- 1.0
- Updated
- July 2026
About
Gerulata Technologies builds AI-powered tools for fighting disinformation and hostile propaganda. The brand borrows its logic from the product: an interface that lives in the dark, where anything that lights up means something.
Seek the signal
Headlines highlight the key phrase in white and mute the rest to 60%. Photography keeps one subject sharp inside blurred motion. Light and sharpness give away the essence.
Typography does the work
Hierarchy comes from large size contrast, not from borders, boxes, or color. APK Galeria carries the message; Inter carries the metadata. Everything sits on an 8 px rhythm.
Logo
The wordmark is a custom cut built around the double-circle g, a nod to the Roman fort the company is named after. It renders in one color, on one kind of surface: full white on near-black, or full near-black on white.
Clearspace
Keep a margin equal to the height of the g on all sides. Nothing enters it: no copy, no imagery, no edges.
Minimum size
96 px wide on screen, 24 mm in print. Below that, use the g symbol alone.
One color only
White #FAFBFE on dark, #08090B on light. Never the accent blue, never a gradient, never an outline.
On photography
Only over calm, dark areas of an image; add a scrim if contrast drops below 4.5:1. Never over a subject.
Product & Symbol
The symbol is the lowercase g, the first letter of the wordmark set free. Two circles stacked on a shared spine, closed by the bar. It is the avatar, the favicon, the watermark, and the loading state.
Construction
The g is lifted from the wordmark unchanged: two equal circles on a shared vertical axis, joined by the horizontal bar. Never redraw it; export it from the master.
Usage
Use the symbol alone where the name is already established: app icons, avatars, stamps, UI corners. Pair with the wordmark at a 40 px gap in lockups.
Sub-brands
Product marks share one grammar: a 440 px grid, a single geometric gesture, one weight of stroke. Each mark is the product’s core motion: GladiOS orbits, Augur scans, Vector converges. The logotype pairs the mark on its app-icon tile with the name in APK Galeria Medium.
Bare marks ship in near-black #08090B for light surfaces; on the dark canvas they invert to white, never the accent blue. Logotypes are fixed lockups: tile, mark, and name never rearrange or restyle.
Typography
Two typefaces, strictly divided. APK Galeria, a grotesque with just enough character, carries every headline and eyebrow that speaks with the brand’s voice — eyebrows in Bold, everything else in Regular. Inter carries body copy, UI chrome, labels, and metadata. High contrast in size, minimal contrast in weight. No italics — emphasis comes from color and weight, never slant.
APK Galeria
Display: headlines, subheadlines, eyebrows, nav
Regular / Medium / Semi-Bold / Bold
Inter
Text: body copy, buttons, forms, labels, annotations
Variable, loaded at 400–600
Display headingAPK Galeria Regular / 72 / 1.08Tracking −2.5% / page heroes
Heading 1 — page titlesAPK Galeria Regular / 56 / 1.1Tracking −2% / two-tone emphasis
Heading 2 — section titlesAPK Galeria Regular / 40 / 1.15Tracking −2%
Heading 3 — cards & CTA panelsAPK Galeria Regular / 28 / 1.2Tracking −2%
Body Large — supporting paragraphs next to section titles.Inter Regular / 18 / 27Tracking +1% / usually White 60%
Body Small — secondary paragraphs in cards and expandable sections.Inter Regular / 15 / 23White 60% / comfortable reading leading
Body Compact — dense UI text: nav, footers, tuned card budgets.Inter Regular / 14 / 20White 60% / tighter than Body Small on purpose
CAPS LABEL — EYEBROWS & METADATAAPK Galeria Bold / 12 / 17Tracking +10% / uppercase
Two-tone emphasis
Long headlines split into a bright phrase and a dim one: the key message in White 100%, the rest in White 60%. One split per headline: if everything is bright, nothing is.
APK Galeria
Licensed for Gerulata brand use and not distributed here. Internal teams get the files from the design team.
APK Galeria RegularLicensed
APK Galeria MediumLicensed
APK Galeria Semi-BoldLicensed
APK Galeria BoldLicensed
Inter
Open source under the OFL. Download it directly.
Color
Near-black is the ground, white is the figure, and one blue is allowed to glow. Transparency steps of the same white do the work of an entire gray ramp: text, borders, and glass surfaces are all White at different opacities. Click any value to copy it.
Foundation
Accent
White opacity steps
Ratios to respect: White 100% on Canvas is 18.5:1; White 60% is 10:1. Live Blue passes on Canvas for large type and UI only; never set body copy in blue.
Insignias
Inspired by Roman insignias, these supporting elements evoke authority and heritage; every piece is cut from the geometry of the logo. The vocabulary is small: full circle, half circle, quarter circle, and dash. From it come the badges of the five verticals, a full encoded alphabet, and free compositions of three to five segments.
Construction: segments of one ring (radius 16.3, stroke 7.3 on a 40 px tile) arranged on the quadrant grid with hairline seams. Click a letter to download its glyph.
Letters n, i, p, e and r are canonical: they are the shipped badges of the five verticals below. The remaining letters are constructed from the same grammar.
National SecuritySVGInstitutional STRATCOMSVGPolitical CampaignsSVGEnterprise Risk & SecuritySVGResearch & NGOsSVG
Insignia generator
Insignias consist of twelve segments that arrange vertically or horizontally in different orders: full circle, half circle, dash, and nine quarter-circle pairs. An insignia carries three to five segments and appears once per communication material. Switch to letters to set a word in the alphabet instead. Click a segment to change it.
Imagery
Photography follows the same rule as the headlines: one subject sharp, the rest allowed to blur. Shoot or generate in the dark end of the palette, light the subject with screens or a single source, and let a small amount of blue leak in. No stock smiles, no bright offices, no decoration.
Prompt examples
The editorial set: starting points for generated imagery. Keep the constraints (one subject sharp inside blurred motion, near-black ground, light as information) and swap the scene. Click to copy.
Interactive elements
Interface elements are glass: white at single-digit opacities, a bevel highlight on the top edge, and motion that settles quickly. The blue dot means live. It is the brand’s smallest and most important element.
Buttons
Chips & labels
National Security
Benefit
Eyebrow labelThe live dot
9 × 9 px, Live Blue, soft glow. It marks anything happening now, never decoration.
160 msFastHovers, toggles
260 msBaseSurface & color changes
520 msSlowPanels, accordion morphs
720 msRevealScroll-in entrances
Default easing is ease-out-quart, cubic-bezier(0.25, 1, 0.5, 1). Every animation is gated by prefers-reduced-motion and falls back to its final state.
Layouts & surfaces
Every dimension in the system is a multiple of 8, with 4 as the half-step. Off-grid values are not used. The page is a 1600 px canvas with 72 px margins; sections separate with a 1 px hairline at White 20%, never a color change.
The container
- Content width
- 1456 px on a 1600 px design canvas
- Page margins
- 72 px, fluid down to 20 px on mobile
- Section padding
- 72 px all sides / heroes end at 104 px bottom
- Section separation
- 1 px hairline, White 20%, never a colour change
- Header
- 88 px tall / logo left / actions right / backdrop blur
8 px rhythm
4list card gaps
8indicator gaps
16inside buttons, stacked text
24card padding
32card content gaps, panel padding
40title ↔ body, logo lockup gap
48nav gaps, panel padding
72page margins, section padding
104hero bottom padding
CanvasThe page. #08090B, nothing lighter behind it.
Glass cardWhite 8% fill, bevel top highlight, 4 px radius.
Active cardWhite 20% fill for the expanded accordion state.
Image frameNear-black #141416 backplate behind every screenshot.