NODQ brand

Brand identity, design system and materials for use.

Brand guideUpdated 9 October 2026

NODQ

Precise geometrySquare outline, bevels, even spacing.

Warm accentOrange occupies a small portion of the screen, only for the primary element.

Clear motionOne action — one brief change.

Brand character

Technical precision, calm surfaces and one warm accent. Below are observable style principles, not an interpretation of the symbol.

GeometryA rounded square outline — a space and an access boundary.

MaterialsMatte graphite with a single amber edge.

TypographyA large, clear word and a restrained explanation.

MotionCause → change → result.

Logo

The site's current composition: the symbol and NODQ wordmark. The approved vector source has not yet been published, so the logo cannot be downloaded.

NODQ

Primary composition · symbol + NODQ

Symbol · standalone asset status not approved

Small sizes · 32 / 24 / 16 px — readability check

The checkerboard is a preview background only. Monochrome versions and favicon are not shown: source files are unavailable.

Clear spaceProposal, not a current standard: x = ¼ of the symbol height, clear space ≥ 1x on all sides.

Minimum sizeCandidates for testing: composition at least 120 px wide, symbol at least 24 px. Favicon 16/32/48 px is a separate asset requiring testing.Proposal · requires approval

Do not do this

✕ Do not stretch

✕ Do not rotate

✕ Do not change colours

✕ No other shadows

The three-dimensional object on the homepage is a decorative asset; a flat logo is used wherever a reproducible symbol is needed.

Colours

The values match the site tokens and nodq-tokens.css / .json files.

NODQ Orange Primary accent and CTA #F7931A · RGB 247, 147, 26

Deep Background Dark background #0A0C0B · RGB 10, 12, 11

Graphite Panels #151917 · RGB 21, 25, 23

Raised Graphite Nested surfaces #202622 · RGB 32, 38, 34

Warm White Light background / text on dark #F5F4F0 · RGB 245, 244, 240

Ink Dark text and wordmark on orange #121613 · RGB 18, 22, 19

Hover CTA#FFAA33

Pressed CTA#E3810C

Highlight (graphic)#FFBD59

Shadow face (graphic)#D96800

Secondary text · dark#B6BCB7

Secondary text · light theme#59625B

Link · light#9A4A00

Success#8DD6AB / #166B40

Warning#FFD08A / #875000

Error#FF9B92 / #B7342A

Accent / selected✓ Success! Warning✕ Error Body text · secondary · link Keyboard focus

Contrast pairs: #121613 on #F7931A ≈ 7.95:1 · #F5F4F0 on #0A0C0B ≈ 17.8:1 · #9A4A00 on #F5F4F0 ≈ 5.7:1. Small white text on orange is not used. CMYK/Pantone values have not been published.

Typography

Onest 400/500/600/700 and JetBrains Mono for addresses and signatures. Values are the site's actual styles.

Aa Bb 0123Onest · 400 / 500 / 600 / 700 · Cyrillic and LatinRegularMediumSemiboldBold

Custom text

H1clamp(34px, 4.4vw, 58px) · 700 · 1.05 · -0.035em Люди. Агенты. Одна сеть.

H2clamp(26px, 2.8vw, 38px) · 600 · 1.12 · -0.025em Правила для расходов агента

Lead17–20px · 500 · 1.4 · -0.01em Сеть для приложений, AI-сервисов и расчётов.

Body16–17px · 400 · 1.6 · 0 Агент работает в пределах бюджета, получателей и срока.

Caption13–14px · 400 · 1.45 · 0 Демонстрация · данные-образцы

Label (mono)11px · 400 · 1.3 · 0.08em Заказ #A-1042

Code / Address13–14px · 400 · 1.5 · 0 0x3f2c…a91e · 40,8021 NODQ

Grid and dimensions

Show grid on sample

SectionSection headingText maintains a line width of 60–75 characters.

Containermax-width 1360px

Side marginsclamp(20px, 4.5vw, 72px)

Section spacingclamp(48px, 6vw, 104px)

Grid gaps8 · 12 · 16 · 20 · 24 · 32 px

Corner radii8 fields · 10 buttons · 12–16 cards · 999 labels

Lines1 px divider · 1.5 px diagrams

Focus2 px outline + glow

Shadowsproduct menus and dialogs only

Components

Static state samples and one local form example — no request is sent anywhere.

Buttons

Primary Hover Pressed Secondary Unavailable

Tabs and labels

SelectedRegular

DemonstrationBeing designedDocument being preparedAvailable

Field and error EmailHint below the field

Icons and graphics

Lucide line icons at 1.5–2 px on a 16 / 20 / 24 px grid and a shared visual vocabulary across products.

file-textreceiptmessages-squareusersfoldersearchplugflag

Do not mix line, filled and three-dimensional icon sets.

Space

Agent

Authority

Settlement

Motion

One example at a time. Curve cubic-bezier(0.2, 0.8, 0.2, 1). When the system's reduced-motion setting is enabled, the final frame is shown.

Button / tab 180 ms · hover, selection

State change 350 ms · new status

Brand route 1000 ms · one action

No rainbow branding, custom cursor, scroll hijacking, letter-by-letter heading typing or random amount animations.

Usage examples

The same rules on real site pages.

Website opening screen →Dark scene, brand object, orange CTA Agent Wallet panel →Rule checks, semantic states IZIGRAM workspace →Light document, selected access scope

Presentation cover, announcement card and partner co-branding are not shown: there are no approved materials.

Download materials

Only existing files are published. A combined ZIP package has not yet been assembled.

Tokens · CSSColours, fonts, container, motion curve · CSS · text · 9 Oct 2026Download

Tokens · JSONThe same set of values for applications · JSON · text · 9 Oct 2026Download

Brief guidelinesContents and how to use them · TXT · text · 9 Oct 2026Download

SVG logoNo approved source fileDocument being prepared

PNG logo (light / dark)No approved source fileDocument being prepared

Brand package ZIPNo approved source fileDocument being prepared

Version and feedback

v0.19 Oct 2026 · first publication of the guide: palette, typography, components and tokens. Draft.

Brand usage questionThrough the “Contacts” page