Custom Cards
Modular bento grid cards for your dajia.lol profile
Custom Cards
Cards are modular blocks that live on your profile's bento grid. You can add cards to show off your music taste, social media, developer profiles, gaming stats, or even write custom text.
The Bento Grid
Your profile uses a beautiful, responsive bento grid layout. You can easily drag, drop, and resize cards to design a profile page that is uniquely yours.
Size System
Different cards support different sizes on your grid:
| Size | Name | Typical Use |
|---|---|---|
s | Small | A square block. Great for single stats, profile pictures, or short text. |
st | Small Tall | A vertical rectangle. Perfect for tall content like GitHub activity lists. |
m | Medium | A horizontal rectangle. Ideal for more detailed profiles or two-column content. |
l | Large | A full-width block. Excellent for showcase features or large stats. |
Note: Not all cards support every size. Check the individual card guides below to see which sizes you can use.
Grid Position
You don't need to manually configure coordinates! You can design your page visually:
- Move Cards: Click and drag a card to any empty space in the editor grid to reposition it.
- Resize Cards: Use the handles on the corners of a card to stretch it across columns or rows.
Adding & Configuring Cards
Getting started with cards is simple:
- Go to your dashboard and navigate to Settings => Cards.
- Click the Add Card button.
- Choose the type of card you want to add from the menu.
- Select a size and place the card onto your grid layout.
- Click on the card to open its Settings Panel on the right side.
- Customize the card's behavior (like adding your username or tweaking colors) — changes will show in the Live Preview instantly!
- Click Save at the bottom to publish your updates.
Custom Styling
While cards automatically match your profile's global style settings, you can customize each card individually:
- Override the background color, transparency, and corner roundness.
- These overrides apply to the selected card only, allowing you to highlight specific blocks on your page.
Card Categories
Available Cards
Here is a quick look at all the cards you can add to your profile:
| Card Name | Category | Supported Sizes |
|---|---|---|
| About Me | Profile | s, m |
| Last.fm Now Playing | Music | s |
| Last.fm Stats | Music | l |
| Spotify Artist | Music | s |
| Spotify Embed | Music | s |
| Audio Player | Music | s |
| Discord Presence | Social | s |
| Discord Server | Social | s |
| YouTube Channel | Social | s |
| YouTube (ST) | Social | st |
| Bluesky | Social | s |
| Mastodon | Social | s |
| Twitch | Social | s |
| Letterboxd | Social | s |
| RSS Feed | Social | s, st, m, l |
| GitHub User | Developer | s |
| GitHub Profile (ST) | Developer | st |
| GitHub Repo | Developer | s |
| GitHub Activity | Developer | s |
| GitLab User | Developer | s |
| GitLab Profile (ST) | Developer | st |
| Steam Profile | Gaming | s |
| Valorant Profile | Gaming | s |
| osu! | Gaming | s |
| Minecraft | Gaming | s |
| Markdown Text | Content | s |
| Markdown Text (Stacked) | Content | st |
| Markdown Text (Large) | Content | l |
| Website Embed | Content | s |
| Website Embed (M) | Content | m |
| Countdown | Content | s |
