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
App favicons
Per-app SVG favicons — one JVS tile family, hue + glyph per deployed app. Faux tab strip + per-file swatches.
brand-favicons.html
18
Links
Inline links inside body copy. Live to the toolbar state + a real pointer/keyboard; animated bloom focus ring.
comp-links.html
19
Tooltip
Hover / focus label — simple, multiline & keyboard-shortcut variants.
comp-tooltip.html
20
Buttons
Primary, secondary, ghost, danger. One canonical instance of each — toolbar drives state.
comp-buttons.html
21
Chips & badges
Document-type, validity, availability & classification chips. Filled / outlined / dot treatments.
comp-chips.html
22
Iconography
The blessed Bootstrap Icons subset + sizing, alignment and colour rules — icons are text, one pinned family.
comp-iconography.html
23
Text inputs
Plain, with icon, error and disabled — wrapper carries the focus ring.
comp-inputs.html
24
Textarea
Same .field shell as inputs; icon stays top-aligned.
comp-textarea.html
25
Search
Search shell with clear button + suggestion list (live).
comp-search.html
26
Select / combo
Custom-styled trigger with chevron + dropdown list.
comp-select.html
27
Checkbox / radio
Whole label is the hit target; focus ring wraps glyph + label; error variant for required checkboxes.
comp-checkbox-radio.html
28
Switch · theme switch
Boolean toggle + the animated icon-thumb theme switch.
comp-switch.html
29
Segmented controls
Flat tabs + pill style with sliding thumb.
comp-segmented.html
30
Breadcrumbs
Root → section → page, with overflow collapse. Current page is plain text.
comp-breadcrumbs.html
31
List toolbar
Results count · sort select · view switch. Container-query responsive — cap the width to watch it demote.
comp-list-toolbar.html
32
Filter group (compound)
Sidebar filter with reset + checkbox rows. Focus rings nest correctly.
comp-filter-group.html
33
Filter pills
Active filters with inline remove button + suggestions.
comp-filter-pills.html
34
Pagination
Three sizes (standard, small, compact).
comp-pagination.html
35
Animated number (compound)
Utility-count transitions — toolbar / facet counts / pager label roll old → new on change.
comp-num.html
36
Request status
Timeline: submitted → under review → approved → released.
comp-status.html
37
Notices
Info · warning · success · error, plus the inline form-message variant.
comp-notices.html
38
Toast
Transient confirmation / error toasts with dismiss.
comp-toast.html
39
Modal (compound)
Scrim-backed dialog — focus trap, scrim/Esc dismiss, --mo-* motion tokens, sizes sm–xl.
comp-modal.html
40
Empty state
No-results / nothing-here placeholders with a recovery action.
comp-empty-state.html
41
Metabox
Definition-list rows on document detail pages.
comp-metabox.html
42
CTA panel
Sticky detail-page panel. Four availability states drive the button set — Buttons tweak applies here too.
comp-cta-panel.html
43
Quick tile
Category entry points for the home / landing layout. Whole tile is the link.
comp-quick-tile.html
44
Document card
Catalogue / search-result card. Cap width to watch chips + CTAs collapse.
comp-doc-card.html
45
Library card
My-library stored-access card — expiry meta + read / download actions.
comp-lib-card.html
46
Cover card
Document-cover tiles with status overlays. Drive the band / gradient via the Cover tweak.
comp-cover-card.html
47
Library cover card
My-library "cover" view — shared cover + read / download actions + expiry. Valid covers only (library simplification).
comp-lib-cover.html
48
Related documents (compound)
Full-row links to cross-referenced standards.
comp-related.html
49
Catalogue table (compound)
Results table — density, row striping & chip treatment driven by the Table tweak.
comp-table.html
50
Request card (compound)
„Moje žádosti“ card — chips + status pill + Status.render timeline + decision notice.
comp-request-card.html
51
Menu
Menu-button + dropdown panel — actions, custom trigger face, custom panel head.
comp-menu.html
52
Bottom sheet
Bottom-docked panel compound — drag handle, half/full snap points, sticky confirm.
comp-sheet.html
53
Feature guide
Context-aware onboarding + what's-new tours — FAB, nudge, spotlight card. Anatomy + cursor gallery here; highlight & interaction demos in the full file.
comp-guide.html
54
Page transition
Subtle cross-page enter motion (rise + fade) replayed on route change — direction ⊥ timing.
comp-page-transition.html
55
Region navigation
F6 / Shift+F6 cycle the landmark regions; skip links jump straight to one. Esc stays reserved for dismiss.
comp-region-nav.html