Sherbet Riot — Personal Website Template
The playful linkinbio personal website template is a single candy-bright card that gathers everything one creator wants to share — links, socials, and side projects — into one page you can drop into a bio. Everything is outlined in thick plum ink and popped off a warm cream background with hard offset shadows, so the whole thing reads like a sticker sheet slapped together by someone having a good day. The name headline is set in Shrikhand's bouncy display type; the link labels and bio run in clean Outfit so they stay fast to tap from a phone.
Sherbet Riot is built as a one-pager on purpose. A visitor lands from Instagram or a TikTok bio, sees your avatar peeking crooked over the top of the profile card, and taps the link they came for without scrolling past a corporate hero. The featured link wears a permanent tangerine fill and a deeper shadow so your most important thing — a new drop, a Patreon, a Substack — never gets lost in the stack. Chips underneath hold your handles; a lime NEW badge tilts on the freshest link.
Every button presses 2px toward the page when you tap it and flattens fully when held, so the page feels physical rather than flat. The inline newsletter field expands right inside the column with no modal, focus rings glow violet for keyboard users, and error states turn the border red without ever filling a button with color. Swap the copy, avatar, and links, pick your accent, and the card is yours in a few minutes.
This template is for creators, illustrators, musicians, and side-project people who want one loud, friendly page to hold every link they share from social bios. It suits anyone tired of gray, corporate profile pages and ready for something that looks like a sticker sheet. If your whole online presence needs to fit above the fold on a phone, this is the card for it.
| Included pages | Home |
|---|---|
| Best for | This template is for creators, illustrators, musicians, and side-project people who want one loud, friendly page to hold every link they share from social bios. It suits anyone tired of gray, corporate profile pages and ready for something that looks like a sticker sheet. If your whole online presence needs to fit above the fold on a phone, this is the card for it. |
| Type | Website |
| Category | Personal |
| Themes | 1 |
What's included
Home
The entire single-page experience: profile card with crooked avatar and bio, the stacked link buttons with a featured link and NEW badge, social chips, an inline newsletter form, and the lilac…
Key features
- The profile card anchors the page as a white plate with a 96px avatar that overlaps its top edge, rotated a crooked -3 degrees with a pink hard shadow, so the linkinbio personal website reads like a sticker the moment it loads.
- A vertical stack of full-width pill link buttons carries verb-first labels like 'Watch my new video' and presses two pixels toward the page on tap for a physical, satisfying press.
- One featured link keeps a permanent tangerine fill and a deeper Level 3 shadow so your most important call to action stays visually loudest in the stack.
- A lime NEW badge tilts +2 degrees on the freshest link, giving this playful personal website design a clear way to flag what just dropped.
- A row of lilac social chips holds handles for Instagram, TikTok, YouTube, and email, each outlined in ink and shadowed so they feel tappable.
- An inline newsletter signup expands right inside the 480px column with a pill input, violet focus ring, and a red error border that never fills the field with color.
- Confetti margin shapes — ink-outlined stars, squiggles, and blobs in tangerine, pink, and violet — float outside the column on wide screens without ever sitting behind text.
- The whole vibrant personal website template ships as a single centered 480px card that looks complete on a phone and charmingly narrow on desktop, with a lilac footer sign-off band.
Design system
Built on the Sherbet Riot design system.
Compare personal templates
| Template | Type | Pages | Themes | Industries |
|---|---|---|---|---|
| Green Rule A Swiss-minimalist one-page resume personal website: grid-locked black-on-paper typography with a single signal-green | Website | 1 | 1 | — |
| Ink & Endpaper A literary one-page author site with a books shelf, bio, events list, and newsletter signup. | Website | 1 | 3 | Creative & Media |
| Scribble Bio A hand-drawn one-page bio with a sketch avatar, doodle link buttons, and a latest-posts strip. | Website | 1 | 3 | Creative & Media |
Screenshots
Every page in the Sherbet Riot template, plus the mobile layout.
Sherbet Riot FAQ
Is this playful linkinbio personal website template responsive on phones?
Yes — the card is designed phone-first at a 480px max width with 20px side gutters, so it looks complete on a small screen. On viewports wider than 768px the confetti margin shapes appear outside the column while the card stays centered and narrow.
How many links can I add to the stack?
The stack is a simple vertical list of pill buttons, so you can add as many as you need, though five to eight keeps it scannable. One link can be marked 'featured' with a tangerine fill, and up to two links can wear a lime badge.
Can I change the colors and fonts?
The palette is defined as design tokens — background, ink, surface, and four candy accents — so swapping the accent recolors hovers, the featured link, and badges consistently. The display font is Shrikhand and the reading font is Outfit; you can substitute your own pairing, but keep display and body separate.
Does the newsletter form actually collect emails?
The form ships as a styled, accessible field with focus and error states, but you connect it to your own provider like Mailchimp or Buttondown by pointing the form action at their endpoint. No backend is bundled.
What browsers does it support?
It works in all current versions of Chrome, Safari, Firefox, and Edge, including mobile Safari and Chrome on Android where most link-in-bio taps happen. The hard offset shadows and press animations use standard CSS with no exotic dependencies.
Is it accessible despite the loud colors?
Yes — all body and label text is dark plum ink on cream, white, or lilac, which clears 12:1 contrast, and every interactive element has a visible 3px violet focus outline. Accent colors sit behind ink text rather than being used as text.
Related templates
A literary one-page author site with a books shelf, bio, events list, and newsletter signup.
A Swiss-minimalist one-page resume personal website: grid-locked black-on-paper typography with a single signal-green
A hand-drawn one-page bio with a sketch avatar, doodle link buttons, and a latest-posts strip.
A letterhead-style symposium site with call for papers, program, registration, and venue details.
A strict Swiss-grid accounting firm site with services, fixed-fee packages, and a consultation form.
A rugged expedition tour site with a trip roster, difficulty ratings, guide bios, and booking inquiry.