Kevin Powell Courses

Figma Dev Mode Is Here

1 rating

Explore Figma's new Dev Mode: enhanced units, VS Code plugin, and features for easier design-to-code workflow. Learn its benefits and limitations for web development.

• YouTube
• 25 minutes
• Self-Paced
• Free Video

Figma Components - The Basics to Creating Robust Components

1 rating

Learn to create robust Figma components using auto-layout. Master basics, build complex forms, and organize effectively for streamlined design workflows.

• YouTube
• 38 minutes
• Self-Paced
• Free Video

Bring a Smile to Your Users' Face With a Confetti Celebration

1 rating

Learn to create engaging confetti celebrations using CSS and SCSS, enhancing user experience with interactive animations and 3D effects.

• YouTube
• 56 minutes
• Self-Paced
• Free Video

Build a Responsive, Animated Accordion That Looks Pretty Good

Learn to create a visually appealing, responsive accordion with smooth animations. Explore HTML structure, CSS styling, JavaScript interactions, and accessibility considerations for an enhanced user experience.

• YouTube
• 1 hour 18 minutes
• Self-Paced
• Free Video

Animating with CSS Transitions - A Look at the Transition Properties

Explore CSS transitions for web animations, covering properties, best practices, and performance tips to enhance user experience and catch attention effectively.

• YouTube
• 18 minutes
• Self-Paced
• Free Video

Flexbox Tutorial - Flexbox Containers

Comprehensive tutorial on Flexbox container properties, covering flex direction, wrap, width, flow, justify content, and align items for effective layout control in CSS.

• YouTube
• 18 minutes
• Self-Paced
• Free Video

Improve Your CSS by Keepin' It DRY

Practical techniques to streamline CSS code by applying the DRY principle, enhancing efficiency and productivity while creating engaging visual effects.

• YouTube
• 20 minutes
• Self-Paced
• Free Video

Animated Glowing Border - Easy to Customize CSS Effect

Learn to create a customizable animated glowing border effect using CSS and SVG, inspired by a Dribbble design. Includes variations and optimization tips.

• YouTube
• 50 minutes
• Self-Paced
• Free Video

From Design to Code - HTML & CSS From Scratch - Frontend Mentor

Explore the process of transforming a design into code, covering HTML structure, CSS styling, and frontend development techniques like flexbox, grid, and variable fonts.

• YouTube
• 36 minutes
• Self-Paced
• Free Video

How to Make a Nice Site With Less CSS

Learn to create visually appealing websites with minimal CSS. Covers color schemes, typography, spacing, and essential styling techniques for efficient and attractive web design.

• YouTube
• 19 minutes
• Self-Paced
• Free Video

Creating a Layered Card With HTML & CSS

Learn to create a layered card using HTML and CSS, exploring subgrid and advanced styling techniques for an engaging UI component.

• YouTube
• 42 minutes
• Self-Paced
• Free Video

How to Create a Responsive HTML Table

Learn techniques for creating responsive HTML tables, including CSS styling, container usage, and accessibility improvements for various screen sizes.

• YouTube
• 27 minutes
• Self-Paced
• Free Video

Getting Started with Variable Fonts on the Web

Explore variable fonts for web typography: learn about their features, implementation, and advantages. Discover resources, conversion techniques, and practical usage tips for enhanced design flexibility.

• YouTube
• 22 minutes
• Self-Paced
• Free Video

3D Tilting Card Effect with Mouse Tracking - HTML, CSS & JS

Create a 3D tilting card effect with mouse tracking using HTML, CSS, and JavaScript. Learn to style code, add 3D layers, implement mouse-following functionality, and make the code editable.

• YouTube
• 23 minutes
• Self-Paced
• Free Video

Common Beginner CSS Mistakes

Discover common CSS pitfalls for beginners and learn effective solutions to improve your coding practices, from avoiding useless declarations to mastering flexbox and positioning techniques.

• YouTube
• 21 minutes
• Self-Paced
• Free Video