YoVDO

Design and Implement Common Tailwind Components

Offered By: egghead.io

Tags

Tailwind Courses Web Development Courses Shadow Effects Courses Image Cropping Courses

Course Description

Overview

Now that we covered fundamentals, we're going to design and implement common components that you will see in the wild.
We'll start with a basic Vue.js application and some hard-coded data that will be displayed within the application.

Syllabus

  • Structure a Basic Card in Tailwind
  • Design Text in a Tailwind Card to Emphasize Important Content
  • Style SVG Icons with Tailwind Utility Classes
  • Use Tailwind to Design a span that Looks like a Badge
  • Crop and Position Images with Tailwind object-fit Utilities
  • Lock an Image to a Fixed Aspect Ratio with Percentage-based Padding in Tailwind
  • Create Depth in a Tailwind Component with Shadows and Layers

Taught by

Adam Wathan

Related Courses

Fundamentals of Photo Editing in GIMP
Skillshare
Photoshop 2020 Essential Training: The Basics
LinkedIn Learning
Design the Web: Creating a Repeating Background in Photoshop
LinkedIn Learning
Photoshop 2020 Essential Training: The Basics
LinkedIn Learning
Learning Photoshop Automation
LinkedIn Learning