Kevin Powell Courses

Stop Fighting with CSS Positioning

Understand CSS containing blocks and positioning to improve responsiveness and control layout. Master absolute, sticky, and fixed positioning for effective web design.

• YouTube
• 22 minutes
• On-Demand
• Free Video

Container Queries Are Going to Change How We Make Layouts

Explore container queries for component-based layouts. Learn basics, real-world examples, range syntax, named containers, and integration with flexbox and grid for more flexible and responsive web design.

• YouTube
• 24 minutes
• On-Demand
• Free Video

How Is This Possible With CSS Only?

Explore advanced CSS techniques with :has() pseudo-class to create interactive form validation and animations, enhancing user experience without JavaScript.

• YouTube
• 20 minutes
• On-Demand
• Free Video

Create Borders With Cut Corners - Fully Responsive CSS and Easy to Adapt

Learn to create responsive buttons with cut corners using CSS custom properties, clip-path, and pseudo-classes. Master advanced styling techniques for unique and adaptable designs.

• YouTube
• 24 minutes
• On-Demand
• Free Video

Generative Art & CSS Houdini with Amit Sheen

Explore generative art, canvas, and CSS Houdini with Amit Sheen in this live stream recording. Learn to create dynamic, visually appealing designs using advanced web technologies.

• YouTube
• 1 hour 36 minutes
• On-Demand
• Free Video

Background Images with HTML & CSS

Learn to effectively use background images in HTML and CSS, covering common issues, sizing techniques, and tips for improved readability.

• YouTube
• 20 minutes
• On-Demand
• Free Video

Animate From Display None

Learn techniques for animating elements with display:none, focusing on the dialog element. Explore solutions for smooth transitions, handling backdrops, and creating closing animations.

• YouTube
• 22 minutes
• On-Demand
• Free Video

Stop Using an Extension to Compile Sass

Learn to compile Sass without extensions using npm scripts. Explore alternative methods, set up efficient workflows, and optimize your Sass compilation process for improved development.

• YouTube
• 22 minutes
• On-Demand
• Free Video

Create Template Layouts for Your HTML with Astro SSG

Learn to create reusable HTML templates with Astro SSG, streamlining web development by reducing repetition and simplifying updates across multiple pages.

• YouTube
• 24 minutes
• On-Demand
• Free Video

Power-Up Your CSS with PostCSS

Enhance your CSS workflow with PostCSS: Learn installation, plugin setup, configuration, and advanced features like custom property media queries for more efficient and powerful stylesheets.

• YouTube
• 20 minutes
• On-Demand
• Free Video

Cloning a Weird Border Design

Learn to recreate a unique border design using CSS, covering techniques like pseudo-elements, positioning, and creative use of borders to achieve complex visual effects.

• YouTube
• 21 minutes
• On-Demand
• Free Video

Write Better CSS Using Logical Properties

Explore logical CSS properties for multilingual support, improved layout control, and enhanced flexibility in web design. Learn practical applications and benefits for modern web development.

• YouTube
• 21 minutes
• On-Demand
• Free Video

Flexbox Is More Complicated Than You Thought

Dive deep into Flexbox's complexities, exploring element sizing, shrinking, growing, and common misconceptions. Learn practical solutions and compare Flexbox with Grid.

• YouTube
• 23 minutes
• On-Demand
• Free Video

Create a Neon Button With a Reflection Using CSS

Learn to create a stylish neon button with glowing text, button glow, and reflection using CSS. Explore performance optimization techniques and add interactive hover/focus styles.

• YouTube
• 21 minutes
• On-Demand
• Free Video

Web Design Tips for Developers

Discover 5 essential web design tips to enhance your projects: optimal line length, effective spacing, color contrast, text alignment, and font property contrast for improved visual appeal.

• YouTube
• 21 minutes
• On-Demand
• Free Video