No. 09 · Commerce & marketplaces · Rate it
Shelf
Consumer app-store shelves — squircle icons, snap carousels, bright pills and a playful night canvas
A mobile-first storefront language for apps, games, media and other catalogs browsed for fun: charcoal night canvas (light mode included), big rounded hero banners, horizontal snap shelves of squircle icons with ratings, ranked top charts with install buttons, category chips, collection cards, an app sheet with rating bars and a bottom tab bar on phones. The publisher console keeps the same playful voice for installs, reviews with replies, release tracks and listing editing.
Best for
- App, game and media stores
- Consumer catalogs browsed on phones
- Creator and publisher consoles
- Entertainment, streaming and kids' content
Not ideal for
- Enterprise and compliance-heavy products
- Long-form reading
- Data-dense finance tools
Signature moves
- Squircle icons (24% radius) with two-color gradients and a lift-and-tilt hover
- Horizontal snap shelves with 'See all' and arrow controls
- Giant rounded hero banners with soft art glyphs and pill CTAs
- Ranked top charts: big numerals, icon, rating, install pill
- Install button that turns into a progress fill, then 'Open'
- Bottom tab bar on phones; bouncy easing on presses and sheets
Try it with another brand color
Opens the demo with only --brand changed. The style should still read as Shelf.
Install this skill
/plugin marketplace add tastefolio/tastefolio.github.io
/plugin install shelf@tastefolionpx skills add tastefolio/tastefolio.github.io --skill shelfcurl -L https://tastefolio.github.io/downloads/shelf.zip -o shelf.zip
unzip shelf.zip -d .claude/skills/Copy the folder anywhere your agent can read it, then reference it from AGENTS.md / rules:
"Follow skills/shelf/SKILL.md for every UI change."Files
Rate this style
Like it? Give it a 👍 below; you sign in with GitHub. The gallery’s Top rated order counts these votes and refreshes every hour. Comments and questions are welcome too.