Skills
.Work. You
Rest

Building Portfolio Cards

Community

Craft award-winning portfolio sections.

Design & Creative#design#frontend#portfolio#animation#case study#cards
Authoralexejluft
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill addresses the challenge of creating visually compelling and engaging portfolio or case study card sections that go beyond basic layouts, ensuring a professional and polished presentation of work.

Core Features & Use Cases

  • Dynamic Card Design: Generates responsive portfolio cards with options for different sizes and aspect ratios.
  • Visual Depth & Animation: Implements advanced shadow systems and GSAP-driven stagger animations for an engaging user experience.
  • Content Strategy: Provides guidelines for using placeholder images (Unsplash IDs or gradients) and ensures no empty card elements.
  • Use Case: When building a personal portfolio website or a client's case study page, use this Skill to create a dynamic grid of project cards that visually highlight key achievements and attract user attention.

Quick Start

Implement the award-level portfolio card pattern using the provided React component and grid layout examples.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: Building Portfolio Cards
Download link: https://github.com/alexejluft/brudi/archive/main.zip#building-portfolio-cards

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.