Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Coursera

CSS UI Effects: Shadows, Gradients & Animations

Scrimba via Coursera

Overview

Transform your UI designs and web sites by combining shadows, gradients, and animations in this practical course. You’ll learn to create depth with soft and hard shadows, building layered, engaging visuals that enhance your layout. Discover how to apply subtle and dynamic gradients to backgrounds, buttons, and cards, achieving visually appealing effects that guide users’ attention. Finally, you'll bring your designs to life with UI animations, using transitions and hover effects to create a smooth, interactive experience. Each section of this course is hands-on, with challenges that help you apply your skills to real-world components. By the end, you’ll know how to add polish to any interface, creating designs that are functional, interactive, and visually compelling.

Syllabus

  • Shadows
    • Explores the effective use of shadows in UI design, and learn how to utilize various shadow techniques to enhance depth, hierarchy, and visual appeal.
  • Gradients
    • Delve into the creative application of gradients in UI design. Leverage the power of color transitions to add depth, visual interest, and enhance the overall aesthetic of user interfaces.
  • UI Animation
    • Bring user interfaces to life with engaging and seamless animations that enhance usability, delight users, and elevate the user experience.

Taught by

Gary Simon

Reviews

Start your review of CSS UI Effects: Shadows, Gradients & Animations

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.