DEV Community

Said MOUNAIM
Said MOUNAIM

Posted on

Redesigning My Portfolio with Claude Code + Frontend-Design Skill

#nextjs #ai #webdev #javascript

I redesigned my portfolio using Claude Code and the frontend-design skill to improve layout, hierarchy, and overall UI quality.

🌐 Live: https://mounaim.dev/

💻 GitHub: https://github.com/saidMounaim/mounaim.dev

Install Claude Code

Install in your terminal:

curl -fsSL https://claude.ai/install.sh | bash
Enter fullscreen mode Exit fullscreen mode

After installation, run:

claude
Enter fullscreen mode Exit fullscreen mode

Install the frontend-design Skill
Install the skills CLI:

npx skills
Enter fullscreen mode Exit fullscreen mode

Search for the skill:

npx skills find
Enter fullscreen mode Exit fullscreen mode

Type:

/frontend-design
Enter fullscreen mode Exit fullscreen mode

Choose the official version from Anthropic and install it.
Launch Claude again:

claude
Enter fullscreen mode Exit fullscreen mode

Inside Claude:

/frontend-design [HERE PROMPT]
Enter fullscreen mode Exit fullscreen mode

Example prompt:

Redesign my portfolio hero section using modern UI best practices.
Improve spacing, typography, and CTA clarity.
Keep it minimal and developer-focused.
Enter fullscreen mode Exit fullscreen mode

I reviewed the changes, refined them, and committed updates.

Top comments (1)

Collapse
 
jubinsoni profile image
Jubin Soni •

Very helpful post