01
Czechia Sans
Family specimen — text vs logotype variant, diverging glyphs (i / I / l), full weight range.
type-specimen.html
02
Display & headings
Size ramp 44 → 15 with weight tiers — 700 only at 24 px and above.
type-headings.html
03
Body type
Eyebrow + body L / body / meta sizes with their line heights.
type-body.html
04
Document codes
Type tag · number · edition pill at the three usage scales. Tag treatment & mono font follow the Combined Tweaks panel.
type-codes.html
05
Primary blue
gov.cz blue ramped 50 → 900. 500 action · 600 hover · 700 press.
colors-primary.html
06
Neutrals
Cool gray with a subtle blue cast — 0 surface → 900 body text.
colors-neutrals.html
07
Semantic colors
Success · warning · error · info. Color is never the only carrier of meaning.
colors-semantic.html
08
Document-type colors
ČOS · STANAG · STANREC · AP — one hue per standard family.
colors-doc-types.html
09
Availability colors
Four access modes — public · login · controlled · metadata-only.
colors-availability.html
10
Spacing scale
4-px base, steps 1–16.
space-scale.html
11
Radii
2–8 px + pill. Small, consistent — no pillowy rounding.
space-radii.html
12
Elevation
Three soft, near-monochrome steps + the accessibility focus ring.
space-shadows.html
13
Lev JVS
The symbol in its four approved colorways on JVS blue #00469B.
brand-lev.html
14
Product wordmark
Logotype lockups — institution + product name. 600 weight at lockup sizes.
brand-wordmark.html
15
Header (gov.cz)
Site masthead lockup — gov.cz bar, brand, primary nav. Cap width to watch tabs / login collapse.
brand-header.html
16
Footer (gov.cz)
Site footer — link columns + brand. Reflows 4 → 2 → 1 column as the width narrows.
brand-footer.html
17
Links
Inline links inside body copy. Live to the toolbar state + a real pointer/keyboard; animated bloom focus ring.
comp-links.html
18
Tooltip
Hover / focus label — simple, multiline & keyboard-shortcut variants.
comp-tooltip.html
19
Buttons
Primary, secondary, ghost, danger. One canonical instance of each — toolbar drives state.
comp-buttons.html
20
Chips & badges
Document-type, validity, availability & classification chips. Filled / outlined / dot treatments.
comp-chips.html
21
Text inputs
Plain, with icon, error and disabled — wrapper carries the focus ring.
comp-inputs.html
22
Textarea
Same .field shell as inputs; icon stays top-aligned.
comp-textarea.html
23
Search
Search shell with clear button + suggestion list (live).
comp-search.html
24
Select / combo
Custom-styled trigger with chevron + dropdown list.
comp-select.html
25
Checkbox / radio
Whole label is the hit target; focus ring wraps glyph + label.
comp-checkbox-radio.html
26
Switch · theme switch
Boolean toggle + the animated icon-thumb theme switch.
comp-switch.html
27
Segmented controls
Flat tabs + pill style with sliding thumb.
comp-segmented.html
28
Breadcrumbs
Root → section → page, with overflow collapse. Current page is plain text.
comp-breadcrumbs.html
29
List toolbar
Results count · sort select · view switch. Container-query responsive — cap the width to watch it demote.
comp-list-toolbar.html
30
Filter group (compound)
Sidebar filter with reset + checkbox rows. Focus rings nest correctly.
comp-filter-group.html
31
Filter pills
Active filters with inline remove button + suggestions.
comp-filter-pills.html
32
Pagination
Three sizes (standard, small, compact).
comp-pagination.html
33
Animated number (compound)
Utility-count transitions — toolbar / facet counts / pager label roll old → new on change.
comp-num.html
34
Request status
Timeline: submitted → under review → approved → released.
comp-status.html
35
Notices
Info · warning · success · error, plus the inline form-message variant.
comp-notices.html
36
Toast
Transient confirmation / error toasts with dismiss.
comp-toast.html
37
Empty state
No-results / nothing-here placeholders with a recovery action.
comp-empty-state.html
38
Metabox
Definition-list rows on document detail pages.
comp-metabox.html
39
CTA panel
Sticky detail-page panel. Four availability states drive the button set — Buttons tweak applies here too.
comp-cta-panel.html
40
Quick tile
Category entry points for the home / landing layout. Whole tile is the link.
comp-quick-tile.html
41
Document card
Catalogue / search-result card. Cap width to watch chips + CTAs collapse.
comp-doc-card.html
42
Library card
My-library stored-access card — expiry meta + read / download actions.
comp-lib-card.html
43
Cover card
Document-cover tiles with status overlays. Drive the band / gradient via the Cover tweak.
comp-cover-card.html
44
Library cover card
My-library "cover" view — shared cover + read / download actions + expiry. Valid covers only (library simplification).
comp-lib-cover.html
45
Related documents (compound)
Full-row links to cross-referenced standards.
comp-related.html
46
Catalogue table (compound)
Results table — density, row striping & chip treatment driven by the Table tweak.
comp-table.html
47
Request card (compound)
„Moje žádosti“ card — chips + status pill + Status.render timeline + decision notice.
comp-request-card.html