Companies Home Search Profile
TrainingHub TrainingHub

Pixel Perfect Figma to Tailwind

Focused View

2:39:04

0 View
  • 001 Pixel Perfect Tailwind Workshop Introduction Epic Web Dev.mp4
    03:14
  • 002 Preparing for a Custom Design Epic Web Dev.mp4
    01:02
  • 003 Unstyled Markup Epic Web Dev.mp4
    00:35
  • 004 Functional and Semantic Markup Epic Web Dev.mp4
    04:01
  • 005 Tailwind Theme Customization and Configuration Epic Web Dev.mp4
    03:06
  • 006 Customizing Tailwind CSS Configuration for a Responsive Design Epic Web Dev.mp4
    09:49
  • 007 The Foundation is Built Epic Web Dev.mp4
    00:32
  • 008 Designing for Mobile First Epic Web Dev.mp4
    02:45
  • 009 Structural Layout Epic Web Dev.mp4
    00:33
  • 010 Dynamic Layout Containers Epic Web Dev.mp4
    06:24
  • 011 Implementing the Content Section Epic Web Dev.mp4
    00:38
  • 012 Creating Layouts with Flexbox and Grid Epic Web Dev.mp4
    07:51
  • 013 Building a Responsive Logo Epic Web Dev.mp4
    00:37
  • 014 Styling Lists with Flexbox & Grid Epic Web Dev.mp4
    10:14
  • 015 Mobile Layout Completed Epic Web Dev.mp4
    00:11
  • 016 Identify Design Changes Across Breakpoints in Figma Epic Web Dev.mp4
    00:37
  • 017 Implementing Responsive Typography Epic Web Dev.mp4
    00:38
  • 018 Responsive Typography Epic Web Dev.mp4
    03:45
  • 019 Spacing Around and Between Elements Epic Web Dev.mp4
    00:16
  • 020 Responsive Spacing Epic Web Dev.mp4
    04:41
  • 021 Creating Responsive Two-Column Layouts Epic Web Dev.mp4
    00:50
  • 022 Responsive Grid Layouts Epic Web Dev.mp4
    03:30
  • 023 Building a Structured Grid Layout Epic Web Dev.mp4
    01:01
  • 024 Responsive Grids with Auto Flow Columns Epic Web Dev.mp4
    01:58
  • 025 Responsive Design Completed Epic Web Dev.mp4
    00:10
  • 026 Place Items in a Grid Epic Web Dev.mp4
    00:25
  • 027 Assign Coordinates to Elements Epic Web Dev.mp4
    01:54
  • 028 Adding Grid Coordinates to Logo Objects Epic Web Dev.mp4
    01:07
  • 029 Lookup Objects for Grid Placement Epic Web Dev.mp4
    03:02
  • 030 Dynamic Grid Placement Epic Web Dev.mp4
    06:58
  • 031 Pixel Perfect Grid Completed Epic Web Dev.mp4
    01:18
  • 032 Adding Interaction Styles Epic Web Dev.mp4
    00:26
  • 033 Styling Text Interactions Epic Web Dev.mp4
    00:13
  • 034 Accessibility with Focus and Hover Styles Epic Web Dev.mp4
    03:02
  • 035 Logo Interaction Styling Epic Web Dev.mp4
    00:23
  • 036 Customizing Hover and Focus Styles Epic Web Dev.mp4
    03:54
  • 037 Interactions Completed Epic Web Dev.mp4
    00:29
  • 038 Creating Engaging UI Animations Epic Web Dev.mp4
    00:56
  • 039 Add an Enter Animation Epic Web Dev.mp4
    01:08
  • 040 Controlling Animation Delays and Fill Modes Epic Web Dev.mp4
    12:10
  • 041 Change Animations Based on Breakpoints Epic Web Dev.mp4
    00:39
  • 042 Responsive Animations Epic Web Dev.mp4
    02:58
  • 043 Implementing Roll Reveal Effect Epic Web Dev.mp4
    02:09
  • 044 Roll Reveal and Fade-In Keyframe Animations Epic Web Dev.mp4
    08:11
  • 045 Adding Stagger Reveal to Animations Epic Web Dev.mp4
    01:35
  • 046 Delayed Animations Based on Loop Index Epic Web Dev.mp4
    03:38
  • 047 Animation Delay Adjustment Epic Web Dev.mp4
    01:00
  • 048 Implementing a Wave Animation Delay Epic Web Dev.mp4
    01:30
  • 049 Animations Completed Epic Web Dev.mp4
    00:23
  • 050 Aligning Grids to Parent Cells Epic Web Dev.mp4
    00:17
  • 051 Fixing Vertical Gap in a Subgrid Epic Web Dev.mp4
    00:27
  • 052 Managing Nested Grids for Organized Layouts Epic Web Dev.mp4
    01:46
  • 053 Child and Parent Grid Alignment Epic Web Dev.mp4
    00:10
  • 054 Adjusting Grid Gaps for Seamless Alignment Epic Web Dev.mp4
    00:57
  • 055 Aligning Elements with Parent Grid Using Subgrid Epic Web Dev.mp4
    00:22
  • 056 Managing Rows and Columns in Responsive Grid Layout Epic Web Dev.mp4
    02:35
  • 057 Content Placement with the Grid Layout Epic Web Dev.mp4
    00:29
  • 058 Responsive Grid Columns Epic Web Dev.mp4
    03:50
  • 059 Aligning Content Within Cells Epic Web Dev.mp4
    00:14
  • 060 Optimizing Grid Layouts Epic Web Dev.mp4
    01:47
  • 061 Subgrids Completed Epic Web Dev.mp4
    00:19
  • 062 Migrate Tailwind v3 to v4 Epic Web Dev.mp4
    00:49
  • 063 Integrating Tailwind v4 with Vite Epic Web Dev.mp4
    00:38
  • 064 Upgrading to Tailwind v4 with Vite Plugin Epic Web Dev.mp4
    02:58
  • 065 Customize the Tailwind Theme Epic Web Dev.mp4
    01:45
  • 066 Customizing Your Design with Tailwind Configuration Epic Web Dev.mp4
    02:22
  • 067 Fixing Font Sizes Epic Web Dev.mp4
    00:21
  • 068 Custom Font Sizes and Line Heights Epic Web Dev.mp4
    02:21
  • 069 Revamping Animations Epic Web Dev.mp4
    00:23
  • 070 Porting Keyframes and Animations Epic Web Dev.mp4
    04:13
  • 071 Tailwind v4 Migration Complete Epic Web Dev.mp4
    00:26
  • 072 Pixel Perfect Tailwind Workshop Outro Epic Web Dev.mp4
    01:09

    • More details

    User Reviews
    Rating
    0
    0
    0
    0
    0
    average 0
    Total votes0
    Focused display
    Category

    Figma

    Udemy
    Udemy
    View courses Udemy
    Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.
    • language english
    • Training sessions 72
    • duration 2:39:04
    • Release Date 2024/11/03

    Courses related to Figma

    User Experience Design - Learn UI UX App Design with Figma
    Udemy Gihan Akalanka
    Gihan Akalanka
    User Experience Design - Learn UI UX App Design with Figma
    6:47:26
    03/13/2024
    UI Design Quick Websites in Figma
    Design codeUI Design Quick Websites in Figma
    34:37
    06/07/2023
    UI Design a Camera App in Figma
    Design codeUI Design a Camera App in Figma
    49:47
    03/29/2023