Upgrade Your Css UI Library - Cards, Buttons, Animations etc
3.6 (70 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
10,513 students enrolled

Upgrade Your Css UI Library - Cards, Buttons, Animations etc

In this course you will learn how to create over 35 different CSS components! Cards, Buttons, loaders... Cool stuff
3.6 (70 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
10,513 students enrolled
Created by Jordan Smith
Last updated 8/2019
English
English [Auto]
Current price: $139.99 Original price: $199.99 Discount: 30% off
23 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 3.5 hours on-demand video
  • 2 articles
  • 80 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • You'll create a UI library of Buttons, Cards, Forms, Animations, Hover Effects and more
  • You'll learn how to take your CSS and HTML skills and create outstanding web components
  • You'll have access to more than 50 videos and their source code that you will be free to use in your own projects
  • You'll learn new ways to use CSS properties
  • You'll find downloadable lectures, code and design assets for all projects
  • You'll get friendly and fast support in the course's Q&A section
  • You'll learn how to use before and after pseudo elements to create amazing designs
Course content
Expand all 37 lectures 03:22:20
+ Introduction
3 lectures 05:46
Introduction
01:25

Music By:

Reflona by SilentCrafter https://soundcloud.com/user-907904720 Creative Commons — Attribution-NoDerivs 3.0 Unported — CC BY-ND 3.0 Free Download / Stream: http://bit.ly/Reflona Music promoted by Audio Library https://youtu.be/ZdhZ1GAT8BQ

Preview 01:56
How to use Font-Awesome
02:25
+ Loading Animation and Typing Animation
11 lectures 57:50
Auto Typing Text Animation
04:06
Typing Text Animation - Version 2
05:28
Floating Text Animation - Amazing for Your Header!
04:16
Shining Text Animation
02:52
Floating Rings Loader Animation
06:04

Credit to "Oleg Frolov"

Preview 06:42
Loader Ripple Animation
04:33
Loading Fill Animation
04:08
Loader Ring Animation
03:53
Loader Animation With 15 Circles
04:30
Loading Snake Animation
11:18
+ Cards - Navigation - Others
9 lectures 59:01
Portfolio For Your Landing page Collection
03:51
Fliping Gallery Box Animation
05:07
Image and Text Reveal Animation
07:16

Credit for Adil Ahmed

Special Tilting Menu
09:29
Rain Animation
03:31
Cards Linear Gradient Hover Effect
07:08
Quote Card With Linear Gradient Animation
08:23
London Cards With Hover Effect
07:03
Card with Clip Path Hover Effect
07:13
+ Buttons
13 lectures 01:19:28
Button With Snake Border Animation
09:03
Button With Border Snake Animation - Version 2
08:08
Social Buttons Flipping Box
06:14
Social Glowing Gradient Buttons
07:20
Activate Button
07:03
Switch Button With Cool Transform Animation
03:31
Power On Button
06:56
Switch Button With Background Change Animation
05:56
Button With Underline Over Effect
03:09
Button With Linear Gradient Effect
04:29
Button Hover Cubic Bezier
05:53
Button With Before and After Transition Animation
05:18
Requirements
  • At least some basic knowledge of CSS
  • At least some basic knowledge of HTML
  • Any computer and OS will work — Windows, macOS or Linux
  • There is no need for any paid software
  • Optional - Basic knowledge of JavaScript (Most videos doesn't requires JavaScript)
Description

                                                  Hi and welcome to an awesome Udemy CSS Course!

                                                                     Creativity is key.


Are you looking to take your CSS skills to the next level?

Does adding 35 more components to your CSS portfolio sound good?

If so, you're in the right place!

CSS is an art and we are all artists!

Throughout the course you will learn how to create more than 50 different CSS components:

Cards - Buttons - Loading pages - Galleries - Forms - Navigation Bars- Sticky headers and footers.


This course is all about CSS!   

----- No  JavaScript knowledge is required -------

We may use Javascript for a few hamburger buttons but don't worry! It's only 3-4 lines of code and will be used sparingly.


If you didn't check out the course video please go ahead and do that :)


Each lecture is for a different component and you'll get the source code as well!

The course has just been launched. We have 35 lessons at the moment and are trying to make more.


The best thing about the course is the support team!

We take great pride in our support.

We will do our best to answer every question within 24 hours. There are no stupid questions. Well, maybe some but we'll answer them anyway :).

Support is our priority!


Basic knowledge of CSS is required! 


During the course, we will use different CSS techniques to show different methods.

Grid (with auto fit and minmax), Flex-box, perspective, and others.

We will be here to answer any questions that you have!

If you're ready to become a better CSS developer hurry up and enroll!

If you're not satisfied there is a 30 - day money-back guarantee. In other words - nothing to lose.


Remember the true power is the QA section where you will find answers and explanations for everything!!


 

Who this course is for:
  • Front-end developers who want to upgrade their UI library with new CSS components.
  • CSS developers who want to modernize their CSS knowledge
  • CSS developers who want to add animations to their toolbox
  • Front-end developers who want to take their Designing skills to the next level
  • Front-end developers who want to take their CSS and HTML skills to the next level
  • Front-end developers who want to better understand CSS by practicing
  • Front-end developers who just want source code . -_-