Learning Paths Showcase Leaderboard

Learn AI by building real projects. From beginner to expert, one challenge at a time.

Platform

Challenges
Learning Paths
Showcase

Community

GitHub
Projects

Legal

Privacy
Terms

© 2026 AI In Action. All rights reserved.

Personal Portfolio | AI In Action

ChallengesPersonal Portfolio

OfficialBeginnerWeb Development

2-4 hours

Personal Portfolio

Build a responsive portfolio website with dark/light mode toggle, smooth scroll navigation, project showcase section, and contact form. Use modern CSS techniques like grid, flexbox, and animations.

0 likes0 forks0 comments

htmlcssresponsiveportfolio

Objectives

Create a responsive layout with mobile-first design
Implement dark/light theme toggle with CSS variables
Build smooth scroll navigation between sections
Add a project showcase grid with hover effects
Include a working contact form

Hints

Use CSS custom properties for theming
Use IntersectionObserver for scroll animations
Try CSS Grid for the project showcase layout

Resources

developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout
web.dev/prefers-color-scheme

Comments (0)

to leave a comment.

No comments yet. Be the first to comment!