Design

Everything about how your page looks lives in one place: the Design tab of the inspector, next to the Block tab. Nothing here is behind Pro. Every theme, layout, font, and color is on the free plan.

The Design panel on the right of the Studio, with theme tiles, layout, color scheme, colors, and font
The Design tab, right of the stage

Open My Page and click anywhere off a block to get to it, or click the Design tab directly. Every control here changes the stage in the middle of the screen as you touch it, so you never have to leave and come back to see what you did.

Themes

Four presets, each a complete look rather than a color swap:

  • Soft depth. Warm ground, floating cards, gentle shadows. This is the default.
  • Frosted glass. A rich backdrop with translucent blocks over it.
  • Editorial. Left aligned, hairline rules instead of cards, a serif for your name.
  • Poster. Loud color, thick borders, hard shadows, and uppercase titles.

A preset decides the shape of your blocks, their alignment, their corner radius, and their shadow. Colors, fonts, buttons, and avatar shape sit on top of it and stay yours when you switch preset, so you can try all four in a row without losing your palette.

Layout

Three options for the top of the page.

  • Classic. Avatar, name, bio, and social icons stacked at the top. No cover image.
  • Cover. A cover band across the top with your avatar overlapping its bottom edge, then name, bio, and socials underneath.
  • Hero. A taller cover image with your name set over the bottom of it in white, darkened towards the base so the name stays readable. Bio and socials sit below it, and the avatar is not shown.

Picking Cover or Hero reveals an upload control for the cover image right underneath. Until you upload one, both fall back to the Classic header, so nothing breaks while you are mid-change.

Colors

Ten color schemes come ready made: default, dark, sage, purple, coral, sky, royal, rose, slate, and mint. Each one sets a background and a text color together, in a single click.

Under them are two pickers of your own:

  • Background
  • Text and buttons

Buttons take their color from the text color, so there is one control rather than two. Touch either picker and the chip beside the schemes switches to Custom, which is how you know you have left the preset behind.

The two are not independent of each other. Picking a ready-made scheme writes both colors, so a scheme click after your own picking replaces what you chose. Do the scheme first, then the fine tuning.

If your background and text end up too close together to read, urls.bio steps in: when the contrast falls below 3:1 it forces the text to black or white so the page stays legible. That override is applied at render, so the picker still shows the color you chose.

Background

Three kinds, chosen with the Background switcher:

  • Solid. The background color above.
  • Gradient. Pick a from color and a to color. It is drawn at 160 degrees. Switching to Gradient seeds both stops from what you already had, so the change is visible immediately rather than after your first color pick.
  • Image. Paste an https:// address. Anything else is refused with "The background image needs a full https:// address." Switching away from Gradient to Image clears the leftover gradient value rather than treating it as a URL.

Fonts

Eight, each previewed in its own face in the menu:

  • Default, the site font
  • Inter
  • Poppins
  • Space Grotesk
  • DM Serif Display
  • Playfair Display
  • Lora
  • JetBrains Mono

Only the font you pick is loaded, so choosing one does not cost your visitors seven others.

Buttons

Shape is Pill or Sharp. Fill is Solid or Outline. Four combinations, and the stage shows each one as you click it.

Avatar

Circle, Square, or Squircle. Once you have uploaded an avatar a fourth option, Cover, appears alongside them. With no avatar uploaded, your page shows your initials in the shape you picked.

Saving

Two speeds, both automatic.

  • Colors, fonts, and backgrounds save half a second after you stop moving, so dragging a color picker writes once rather than fifty times.
  • Theme, layout, button, and avatar changes write the moment you click.

The stage updates instantly either way, so what you see is always ahead of the save, never behind it. If a write fails the control snaps back to its last saved value and a message tells you which one did not stick, for example "Could not save the theme." The pill in the dashboard header is the general answer to "is my work saved?", reading Saving, then Saved.

Common questions

Does any of this affect what people see when they share my link? The link preview card is drawn in your own theme, with your background, avatar, and name. See sharing.

Can I use my own CSS or a custom font file? No. The eight fonts and the color controls above are the whole surface.

Where is the cover image control? It appears under Layout once you pick Cover or Hero. It is not shown for Classic, because Classic has nowhere to put it.

Something looks wrong on a phone but fine on the stage. The stage renders the real page at real widths. Use the two toggles above it to check phone and desktop, and press p for the full-screen version.