Skip to content
Maska
Esc
navigateopen⌘Jpreview
On this page

Design

Brand your page — name, handle, bio and logo — then set the theme colour, background, typography, layout and the two smart switches.

The Design tab controls how the page looks and who it says you are. Every change shows immediately in the preview beside the editor, which is rendered by the same code as the published page — so what you’re looking at is what guests will get once you press Publish.

Nothing here is required. A page with only a name and the default butter theme is a perfectly good page; the rest is there when you want it.

Name, handle and bio

The three fields at the top of the tab are the block at the very top of the public page:

  • Name — the big line under your logo. It starts from the page name you gave at creation and can be changed here at any time.
  • Handle — a short mono line under the name, for something like @katha.india · Hyderabad.
  • Bio — one or two sentences, up to 280 characters.

Logo sets the round avatar at the top of the page. Three modes:

  • Initial — the first letter of your name, drawn in your theme colour.
  • Icon — a generic glyph, again in your theme colour.
  • Upload — your own image. Press Upload logo and pick a PNG, JPEG or WebP up to 5 MiB. SVG is deliberately not accepted. Once one is saved the button reads Replace logo.

Theme colour

Pick one of four brand accents — Butter, Mint, Chilli or Char — or type your own hex in the field beside them. The accent drives the avatar, the Featured card, the buttons and the level bars.

If you want a starting point rather than a hex code, press Suggest: it drops a hand-picked colour into the custom field, and you can press it again until something fits.

Background then decides how that accent treats the page behind your content:

Option Effect
Solid A flat cream base — the accent stays on the components.
Gradient The accent fades in from the top of the page and clears by about halfway down.
Tint A faint wash of the accent across the whole page.

Typography

Choose a Heading font and a Body font independently from the same catalogue of ten families — Hanken Grotesk, Inter, Poppins, Space Grotesk, DM Sans, Fraunces, Playfair Display, Georgia, JetBrains Mono and Space Mono. A small specimen under the two pickers shows the pair together, so you can judge the combination without leaving the tab.

Two cards control how the link buttons themselves are drawn.

Link layout:

  • Link layoutList stacks links one per row; Grid lays them out two across.
  • Link icons — turn the icon tiles on the buttons on or off for the whole page.
  • Hover effectLift, Outline or Fill, the response when a guest presses a button.

Buttons and cards:

  • CornersSharp, Rounded or Pill.
  • Link fillSoft (a white card), Solid (a filled cream card) or Outline (transparent with a strong border).
  • DepthFlat, Soft or Raised shadow.

The two smart switches

The last card holds two switches that adjust the theme for you.

Time-aware theme shifts the accent with the clock: warmer before 11, deeper after 19, and your chosen accent in between — so a page opened at breakfast and the same page opened at last orders don’t feel identical. It applies to the four preset colours only; a custom hex is always shown exactly as you set it.

Auto-contrast keeps your text readable on a custom accent. It measures how light or dark the colour is and picks dark or light ink to sit on top of it, rather than trusting that whatever you typed happens to work. When a light accent forces the text to dark ink, the tab tells you so with a Light accent, dark text warning — that is a note, not an error, and the page still publishes.

Every published Smartlinks page carries a small Made with Maska. Smartlinks line at the bottom. It is part of the page and cannot be switched off.

What guests see next

Design settles how the page looks. What actually sits on it — actions, the Featured card, links and the shop — is built on the Links and actions tab.

Was this page helpful?