Personal brand

Link in bio, résumé and freelancer page for one person.

3 components · 15 variants

Switch category

On this page

Every component of this category. Pick one to jump to its variants.

Freelancer5
Link in bio5
Résumé5

freelancer

Freelancer

For freelancers and solo studios. An intro with live availability, the next months week by week, rates with a day calculator, a project enquiry with budget range and a typical week as a timetable.

Intro with availability
Availability
Rates
Project enquiry
A typical week

Props and details

Intro with availability

The role as the headline, availability with a live dot, answer time, skills that rise in one after another. A card with portrait and three numbers that count up.

Installv1.0.0

aiw add @ai-website/freelancer

Brings along utils, kit, button, icon, motion, number-ticker, section

Usage

<Freelancer variant="intro" person={{ name, role, bio, location, photo }} status="…" response="…" stats={[…]} skills={[…]} />

Source

Availability

The next six months week by week as booked, partly free and free. The first free week is marked, pointing at a week tells its state, cells appear month by month.

Installv1.0.0

aiw add @ai-website/freelancer

Brings along utils, kit, button, icon, motion, number-ticker, section

Usage

<Freelancer variant="availability" weeks={[{ start: "2026-11-02", load: 1 }]} status="…" />

Source

Rates

Hour, day or project behind a gliding switch, the price glides and what is included changes. A calculator beside it counts days as blocks and shows the total.

Installv1.0.0

aiw add @ai-website/freelancer

Brings along utils, kit, button, icon, motion, number-ticker, section

Usage

<Freelancer variant="rates" rates={[{ id, label, unit, price, note, includes }]} dayRate={780} />

Source

Project enquiry

What is needed as cards, a budget range with two handles, the timeline and a few words. The summary beside it follows every choice.

Installv1.0.0

aiw add @ai-website/freelancer

Brings along utils, kit, button, icon, motion, number-ticker, section

Usage

<Freelancer variant="inquiry" types={[{ id, label, icon }]} budget={{ min, max, step, from, to }} onSubmit={(data) => …} />

Source

A typical week

A week as a timetable, focus blocks, calls, admin and time off. The blocks grow in day by day, a red line marks now. How to reach me beside it.

Installv1.0.0

aiw add @ai-website/freelancer

Brings along utils, kit, button, icon, motion, number-ticker, section

Usage

<Freelancer variant="week" blocks={[{ day: 0, from: 10, to: 13, label, kind: "focus" }]} channels={[{ label, detail, icon }]} />

Source

link-in-bio

Link in bio

One page for everything a person links to. Links, products, dates, a newsletter and a share button, as a column, a bento, tabs, a countdown or a split with a portrait.

Stack
Tiles
Tabs
Dates
Split with portrait

Props and details

Stack

The classic column. A portrait in a turning ring, a featured link with a picture, rows that rise in one after another, share copies the address with a check.

Installv1.0.0

aiw add @ai-website/link-in-bio

Brings along utils, kit, button, icon, motion, section

Usage

<LinkInBio variant="stack" profile={{ name, handle, bio, avatar }} links={[{ id, label, href, icon, image }]} socials={[{ label, icon, href }]} />

Source

Tiles

A bento of tiles. Profile, a video that plays on a click, a newsletter with its own form, the next date with a seat bar, two products and the links.

Installv1.0.0

aiw add @ai-website/link-in-bio

Brings along utils, kit, button, icon, motion, section

Usage

<LinkInBio variant="tiles" profile={…} video={{ title, length, href, media }} newsletter={{ title, text, count }} events={[…]} products={[…]} links={[…]} />

Source

Tabs

Links, shop and dates behind one switch. The marker glides, each panel arrives with a soft blur, counts show what is inside.

Installv1.0.0

aiw add @ai-website/link-in-bio

Brings along utils, kit, button, icon, motion, section

Usage

<LinkInBio variant="tabs" profile={…} links={[…]} products={[…]} events={[…]} />

Source

Dates

The next date first, with a live countdown and the seats left. Later dates as a list with a reminder each, the links below.

Installv1.0.0

aiw add @ai-website/link-in-bio

Brings along utils, kit, button, icon, motion, section

Usage

<LinkInBio variant="dates" profile={…} events={[{ id, title, start: "2026-11-14T19:00", kind, place, seats, href }]} links={[…]} />

Source

Split with portrait

A large portrait that stays in place while the links scroll beside it, grouped by what people come for. The picture drifts a little.

Installv1.0.0

aiw add @ai-website/link-in-bio

Brings along utils, kit, button, icon, motion, section

Usage

<LinkInBio variant="split" profile={{ name, handle, bio, cover }} groups={[{ title, links: […] }]} />

Source

resume

Résumé

A CV as a web page. Experience on a line that fills, roles as bars over the years, skills that show where they were used, the one-page paper version and a short summary with counting numbers.

Classic
Timeline
Skills
Compact
Summary

Props and details

Classic

A side column with photo, contact, download, skills and languages that stays in place. Experience on a line that fills while you scroll, education as cards.

Installv1.0.0

aiw add @ai-website/resume

Brings along utils, kit, button, icon, motion, number-ticker, reveal, section

Usage

<Resume variant="classic" person={{ name, role, summary, email, photo }} experience={[{ id, role, company, start: "2020-07", points }]} education={[…]} skills={[{ name, level, group }]} download={{ href }} />

Source

Timeline

Every role as a bar over the years, one row per company, overlaps stay visible. Bars grow in, a click or the arrow keys open the role below. A list with small bars on phones.

Installv1.0.0

aiw add @ai-website/resume

Brings along utils, kit, button, icon, motion, number-ticker, reveal, section

Usage

<Resume variant="timeline" person={{ name, role }} experience={[{ id, role, company, start, end, summary, points, skills }]} download={{ href }} />

Source

Skills

Skills by group with their level as dots that fill. Pick one and the card beside it shows every role where it was used, so a level is backed by work.

Installv1.0.0

aiw add @ai-website/resume

Brings along utils, kit, button, icon, motion, number-ticker, reveal, section

Usage

<Resume variant="skills" skills={[{ name, level, group }]} experience={[{ id, role, company, skills: ["…"] }]} />

Source

Compact

The one-page paper version, as it prints. The sheet settles in while it scrolls into view, download and print sit above it.

Installv1.0.0

aiw add @ai-website/resume

Brings along utils, kit, button, icon, motion, number-ticker, reveal, section

Usage

<Resume variant="compact" person={…} experience={[…]} education={[…]} skills={[…]} languages={[…]} download={{ href, size }} />

Source

Summary

The short version for the top of a personal site. Role as the headline, availability, numbers that count up, the current role and earlier ones on a line that fills.

Installv1.0.0

aiw add @ai-website/resume

Brings along utils, kit, button, icon, motion, number-ticker, reveal, section

Usage

<Resume variant="summary" person={…} stats={[{ value: 12, suffix: "+", label }]} experience={[…]} download={{ href }} links={[{ label, href }]} />

Source

Similar components

More from Industries, the same area of the kit.

Often combined with

Sections that usually sit next to Personal brand on a page.

Copied to the clipboard