#nav-wrapper { position: relative; top: auto; padding-top: 12px; } #nav-wrapper .km-nav-shell { flex-wrap: wrap; gap: 16px; } #nav-menu { position: static; width: 100%; max-width: 40rem; max-height: none; margin-top: 0; visibility: visible; opacity: 1; transform: none; pointer-events: auto; } #nav-dock { --km-dock-count: 4; grid-template-columns: repeat(4, minmax(0, 1fr)); } #nav-toggle { display: none; } @media (width < 1280px) { #nav-dock[data-active-index="4"] :is(.km-dock-spotlight, .km-dock-light-mask) { display: none; } } @media (min-width: 1280px) { #nav-dock { --km-dock-count: 5; grid-template-columns: repeat(5, minmax(0, 1fr)); } #nav-dock[data-active-desktop-index="5"] :is(.km-dock-spotlight, .km-dock-light-mask) { display: none; } #nav-wrapper { padding-top: calc(var(--km-nav-top) + var(--km-nav-dock-height) + 1rem); } }

Landing pages

1article

7 UI rules for better pages: green lettering on an indigo background beside a white page illustrating alignment, spacing and visual consistency.

UI Guide: 7 Principles for Web Pages and Landing Pages

Build clearer pages with seven UI principles covering structure, alignment, sizing, spacing, consistent styles and intuitive interactions.

October 14, 2026