Cards — People

Profile, contact, and testimonial cards for people and social UIs.

Cards for people — profiles, contacts, and testimonials. The brand colour maps to --primary, so avatars, follow buttons, and accents follow the active theme.

Preview

Ana Ruiz

Product Designer · Lisbon

Designing calm interfaces and the occasional deck. Cards are my love language.

2.4k

Followers

318

Following

Shots

Marcus Bell

Engineering Lead

PST

[email protected]

+1 (415) 555-0198

We reskinned the entire dashboard in an afternoon. One token swap and every card just… belonged.

Priya Shah

Head of Design, Northwind

Install

Each card installs on its own:

bun x bosia@latest add block cards/profile
bun x bosia@latest add block cards/contact
bun x bosia@latest add block cards/testimonial

Each pulls the @lucide/svelte npm package for icons.

Usage

<script lang="ts">
	import Profile from "$lib/blocks/cards/profile/block.svelte";
</script>

<Profile />

The follow toggle on the profile card is cosmetic local $state — replace it with your own handler.