Fonts, colors and shape
The KuikPage settings panel styles every page at once. Blocks inherit it and can override their own tone.
Switch the inspector to KuikPage. A row of theme swatches at the top restyles the whole page in one click; the sets below fine-tune it.
Fonts
Title and Text pick from six system stacks and over a hundred self-hosted open-licence webfonts, served from kuik.page so visitors never load fonts from a third party. Title faces range from condensed poster type and fashion serifs to art deco, blackletter, pixel and signature scripts. The picker is searchable. Browse pairings opens over seventy curated combinations sorted by mood, Serif, Sans, Display and Script, each named for its character (Editorial, Clean, Bold, Warm...). The default, Brand font, inherits the fonts saved in your Brand Kit. Display faces that come in one weight, such as Instrument Serif, keep that weight in titles instead of a thickened imitation of bold. Title weight sets the header title on every page in Regular, Medium, Semibold, Bold (the default) or Extra bold, listing only the weights the title font really has.
Color
- Background: solid, gradient (up to six stops you can drag, past one another too) or image. Images take saturation, brightness, a tint color with strength, and opacity over the base color, and you can pick from stock photos.
- Texture: one of 55 patterns over the background, whatever its type (the same patterns as the header's and the QR frame's), with Color, Opacity (it starts on Normal at a soft 12%, in black or white, whichever shows, since words sit on it, and goes as low as 3%), Size and Blend. It runs behind every block and holds still while the page scrolls, like a photo background; cards and buttons stay solid on top. On a computer it fills the page's card, sized to the card. A Cover header's sheet lets it show through.
- Accent: the color of buttons, links and highlights.
- Text: Auto picks light text on a dark background and dark text on a light one. Turn it off to set your own color; a warning appears when contrast drops under 4.5 to 1.
- Block tone: Auto, Light, Dark or Accent for cards and panels. Text always reads against the block.
There is no separate light or dark mode: the page derives it from the background you chose. In a multi-page KuikPage, the Page scope can override the text color for one page.
Shape
- Block corners: rounding on cards, images and panels.
- Button corners: rounding on buttons, fully round at 100%. It steps aside while a button edge is on, since edges keep corners square.
- Button edge: Straight, Wavy, Torn, Scallop or Zigzag along the top and bottom of every button, with straight sides and square corners. It reaches every button on the page: the Buttons block, the header button, form and Guest uploads buttons, coupons, calendar, map and download links, and photo banner buttons (Glass and Cut corners keep their own shape). Filled buttons keep the Solid and Raised shadows and the Border, drawn along the edge; outline buttons draw their outline along it. Labels, icons and button sizes stay as they were.
- Shadow: how far cards lift off the background.
- Shadow style: Soft is a blurred lift under cards. Solid is a hard offset slab in the text color on cards, buttons, photo banners and the tab bar. Raised keeps cards and buttons in the page color and pushes them out of it with a light edge and a soft shade, the soft-UI look; buttons press inward on tap and the Border slider is hidden, since the edge is drawn by light and shade.
- Border: an outline in the text color around cards and buttons.
- Spacing between blocks.
- Side margins: the space between the blocks and the page edge.
Motion
Animate on scroll makes each block's pieces fade and rise into view, one after another, as visitors reach them: the header's lines, each button, each product card, each question. Carousels, the strip, Before & After sliders, charts and cards move as one piece, and a pinned button never hides. The canvas stays still while you edit; turn on Preview to watch it. Visitors who ask their phone for reduced motion get the page without it.
Desktop
KuikPages are made for phones, and a computer shows the same page as a card in the middle of the window, a little wider than on a phone, on a darker shade of your background. On a page with an image background, the card shows the photo as a phone does, and the photo carries on around it, darker and blurred. As visitors scroll, the Share and contact buttons ride up with the card and stay near the top of the window, then fade out once the header has scrolled under them and come back on the way up; the menu button always stays.
Show the KuikCode puts the page's own KuikCode in the bottom corner of the window on the home page, so a visitor on a computer can scan it and keep reading on their phone. Those scans count on the code like any other. It appears once the page has its own KuikCode, which publishing links for you, and it never shows on phones or tablets. Changes reach the live page the next time you publish.
Language
Page language sets the language of the words the page adds on its own: Add to contacts, Share and View QR code, the menu, form and upload messages, dates and times, countdown units and the photo viewer. A new page starts in the language your account uses, and English and Spanish are available. Labels that still hold their default, such as a form's Send or a product's Buy now, switch with the language; anything you typed stays as you wrote it. Changes reach the live page the next time you publish.
A link to a KuikPage that does not exist, or to one that is paused, shows its notice in the visitor's own language, English or Spanish.
Your analytics
The last set in the KuikPage scope takes a Google Analytics measurement ID, a Meta Pixel ID and a Tag Manager container, loaded on the published page only (PRO). KuikCode counts scans, views, clicks and leads on its own; these add your tools on top.
Brand Kit
When the workspace has a Brand Kit (PRO), new pages start from its fonts, and its colors appear first in every color picker.