Css Art Practical And Creative Illustrations With Css

Free Download Css Art Practical And Creative Illustrations With Css
Published 8/2024
MP4 | Video: h264, 1920×1080 | Audio: AAC, 44.1 KHz
Language: English | Size: 9.63 GB | Duration: 16h 37m
Explore the creative artistic possibilities of CSS. Bring your artistic ideas to reality using CSS

What you’ll learn
Use CSS techniques to Design logos of TikTok, Gmail, Pepsi, Google, etc.
Use CSS techniques to Design Eva from Walle, Bart Simpsons, PlayStation game pad, smiling emoji, South African flag, etc.
Learn how to use linear and radial gradients and shadows to add depth and dimension to your artwork.
Apply CSS properties like transform, border-radius, box-shadow, z-index to create intricate designs.
Learn how to use pseudo-elements (::before and ::after) to add extra layers and details to your drawings.
Understand how to use CSS to control the appearance and structure of HTML elements.
Requirements
Ability to write CSS syntax properly and use CSS properties is a MUST
Text editor such as VS code, Sublime text, Bracket, Notepad++, etc.
Description
Are you ready to discover a new way to express your creativity? Do you want to transform your web development skills into a powerful tool for creating stunning art? If so, our course on CSS Art: Practical And Creative illustrations With CSS is perfect for you. We will use CSS techniques to design Eva from Wall-e, Bart Simpsons, Video game pad, smiling emoji, South African flag, etc.Use CSS techniques to Design logos of TikTok, WhatsApp, Gmail, Pepsi, Google, etc.This course is designed to open up a world of artistic possibilities. If you are eager to explore the intersection of coding and art, or you are looking to add a unique skill set to your CSS repertoire, then this course is for you.You will learn how to use CSS and HTML to create intricate and beautiful artworks. Imagine the satisfaction of seeing your code come to life as vibrant images and designs. This course will help you harness your coding skills in a way you never thought possible.With CSS techniques, you will be able to create intricate designs and add fine details to your drawings. You’ll also learn how to use pseudo-elements to add extra layers and complexity to your art.You’ll learn how to draw a variety of objects. You’ll understand how to add clip-path properties, shadows, border-radius, textures, etc to make your drawings more realistic and visually striking.Throughout the course, you’ll work on a series of projects that reinforce what you’ve learned. These projects will give you hands-on experience and help you build a portfolio of stunning CSS art. Building a portfolio to showcase your CSS art can impress potential clients or employers and open up new career opportunities. If you’re an illustrator, CSS art is a perfect introduction to coding. If you’re a front-end developer, drawing with code is a creative way to become more familiar with the subtleties of CSS.Don’t miss out on this opportunity to combine your passion for art with the power of coding. Enrol in our course today and start your journey towards becoming a CSS artist. Unleash your creativity and create stunning digital art that will amaze and inspire!
Overview
Section 1: Introduction
Lecture 1 Artistic projects we will create in this course
Lecture 2 Introduction
Section 2: CSS Properties Needed For This Course
Lecture 3 Position Relative
Lecture 4 Position Absolute – Part 1
Lecture 5 Position Absolute – Part 2
Lecture 6 Selectors – Part 1
Lecture 7 Selectors – Part 2
Lecture 8 Creating Variables locally and globally
Lecture 9 CSS units – px rem em
Lecture 10 CSS units – em %
Lecture 11 CSS units – vmin vmax vh vw
Lecture 12 Creating a triangle with border and absolute position
Lecture 13 Using FLEX to centre an element vertically and horizontally
Lecture 14 Positioning an element to the centre using margin and absolute position
Lecture 15 CSS Transform
Lecture 16 The Art of box-shadow
Lecture 17 The Art of linear-gradient and box-shadow
Lecture 18 Circular pattern with radial gradient
Section 3: England Flag Art
Lecture 19 Styling the England flag
Section 4: Laughing Emoji Art
Lecture 20 Basic Structure of the Laughing Emoji
Lecture 21 Styling the eyes and mouth
Section 5: Pepsi Logo
Lecture 22 Styling the Pepsi Logo
Section 6: Bahamas Flag
Lecture 23 Styling the Bahamas Flag
Section 7: Tik Tok Logo
Lecture 24 Basic structure of the Tiktok logo
Lecture 25 Styling the curve at the top
Lecture 26 Styling the curve at the bottom
Section 8: Duck Art
Lecture 27 Basic structure of the duck art
Lecture 28 Styling the nostril, eye, duck body and flip feather
Lecture 29 Styling the feathers
Lecture 30 Styling the legs
Section 9: WhatsApp Logo
Lecture 31 Basic structure of the WhatsApp logo
Lecture 32 Styling the white triangle
Lecture 33 Styling the green triangle and the phone icon
Section 10: Bulb On and Off
Lecture 34 Basic structure of the bulb
Lecture 35 Styling the handle of the bulb and the shade colour
Lecture 36 Styling the checkbox to give the on-off effect
Section 11: Spinning Fan
Lecture 37 Basic structure of the spinning fan
Lecture 38 Styling the blades of the fan, the rod and the base
Lecture 39 Styling the turn on-off button and animating the fan
Section 12: Popsicles Art
Lecture 40 Basic structure of the popsicles
Lecture 41 Styling the popsicles with gradients
Section 13: Gmail Logo
Lecture 42 Styling the blue and green part of the logo
Lecture 43 Styling the crimson skewed part of the logo
Section 14: Eva from Wall-E
Lecture 44 Basic structure of eva
Lecture 45 Styling the 2 eyes
Lecture 46 Styling the body and 2 arms
Section 15: Google Logo
Lecture 47 Styling the Google logo
Section 16: South African Flag
Lecture 48 Basic structure of the South African flag
Lecture 49 Styling the triangles and the the lines on the flag
Section 17: Uchiha Logo
Lecture 50 Styling the Uchiha Logo
Section 18: Video Game Pad Art
Lecture 51 Basic structure of video game pad
Lecture 52 Styling the 2 handles
Lecture 53 Styling the circle holder
Lecture 54 Styling the tap button and the direction keys
Lecture 55 Rotating and translating the direction keys
Lecture 56 Styling the circle buttons
Lecture 57 Styling the joysticks
Lecture 58 Styling the 2 small rectangle buttons
Lecture 59 Styling the analog and red light
Section 19: Bart Simpson head
Lecture 60 Basic structure of Bart Simpson head
Lecture 61 Styling the hair structure from hair-1 to hair-6
Lecture 62 Styling hair-7 to hair-9 and the forehead
Lecture 63 Styling the back and the eyebulge
Lecture 64 Styling the 2 eyes
Lecture 65 Styling the nose
Lecture 66 Styling the cheek and the covering of the nose
Lecture 67 Styling the lip and the lower jaw
Lecture 68 Styling the neck
Lecture 69 Styling the round neck and the ear shape
Lecture 70 Styling the ear linings
Anyone who wants to learn how to draw or make illustrations with CSS
Homepage

https://www.udemy.com/course/css-art-practical-and-creative-illustrations-artworks-with-css/