Tweet

This Thread may be Removed Anytime!

Twitter may remove this content at anytime! Save it as PDF for later use!

More from @Prathkum

Pratham

@Prathkum

17 May

5 great background websites for every web developer and designer

🧵👇

1. Magic pattern

Beautiful pure CSS background patterns that you can actually use in your projects. They are highly customizable as well.

🖇️ magicpattern.design/tools/css-back…

2. Cool backgrounds

Collection of cool backgrounds that you can add to blogs, websites, or as desktop and phone wallpapers

🖇️ coolbackgrounds.io

Read 6 tweets

Pratham

@Prathkum

17 May

Have you heard the term "Tooltip" in web development?

Tooltips guide your visitors to take action and hence provides extra layer of guidance without any difficulties and hence increase the user experience

Let's create a tooltip using HTML and CSS only 🧵👇🏻

We just need to create an element that we will be visible only when user moves the mouse pointer over an elment

STEP1: Let's start with the HTML structure

STEP2: Popup text

- Add some width and padding
- Hide the popup element throughout and show it only on hover
- Place it above the element
- Add little transition for smooth rendering

Read 7 tweets

Pratham

@Prathkum

17 May

CSS art is a good way to enhance and improve your CSS knowledge.

Let's create Phineas using pure CSS in few simple steps 🧵👇🏻

STEP 1. Create a head

create a triangle and rotate it so that it looks like a head

STEP 2. Create smile and ear

We have a pseudo elements in CSS, so we can create smile and ear using head::after and head::before. Its a good way to learn about pseudo-elements

Read 11 tweets

Pratham

@Prathkum

16 May

Functions exists in CSS as well

CSS functions can represent more complex data types and can do special data processing and calculations. Let's talk about it in detail

🧵👇🏻

The syntax of CSS functions is same and standard like in other programming languages. Function name followed by the set of parenthesis and they can accept multiple argument.

{ 2 / 16 }

The functions in CSS is broadly divided into 8 categories. They are

1. Transform functions
2. Math functions
3. Filter functions
4. Color functions
5. Image functions
6. Counter functions
7. Font functions
8. Shape functions

{ 3 / 16 }

Read 16 tweets

Pratham

@Prathkum

15 May

Are you planning to learn CSS for adding some cool styling in your website?

In this thread, I'm covering all the basics and proper plan you need to know in order to getting started with CSS.

🧵 👇🏻

We need to know the importance of CSS first. Why CSS?

Well I guess CSS is the only language that add some visuals in website. Without CSS, Without it, websites would still be plain text on white backgrounds.

{ 02 / 17 }

Let's compare a website with and without CSS

Image 1: With CSS
Image 2: Without CSS

{ 03 / 17 }

Read 17 tweets

Pratham

@Prathkum

15 May

5 best color palette for every web developer and designer 🎨

🧵👇

1. Color hunt

- Color Hunt is a free and open platform for color inspiration with thousands of trendy hand- picked color palettes

🖇️ colorhunt.co

2. Adobe color wheel

Explore and create accessible color palettes using color wheel, in variety of color variations and contrast levels. It will tell you automatically if two colors are not accessible

🖇️ color.adobe.com/create/color-a…

Read 6 tweets

Share this page!

Pratham

Try unrolling a thread yourself!

More from @Prathkum

Pratham

Pratham

Pratham

Pratham

Pratham

Pratham

Did Thread Reader help you today?

Like this author's thread?