Let's create Phineas using CSS in few simple steps😄

THREAD🧵

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
STEP 3. Create eyes

This is the most trickiest part because in order to make an eye we have to create

- One bigger white circle
- then a small black pupil inside white circle
- then a small white reflection in black pupil

Let's create a outer white circle first
STEP 3(I). Create a black pupil

We can create pupil using pseudo element
STEP 3(II). Create white reflection in black pupil

Again make use of pseudo element and create small little white reflection inside pupil
STEP 4. Create moles

Well CSS art is all about creative ideas and solution. In previous step we made oval shape white reflection. We can also create moles using shadow of the white element(reflection) and align them properly
STEP 5. Create second eye

Same as step 3
STEP 6. Create hair spike

This is the easiest part in my opinions because all you need to make are just random spikes.

What I have done here is just created a border-top 20px and rotate it in order to give it a spike look.
STEP 7. Create hairs

Repeat step 6 and create multiple spikes so that they look like hairs😁
That's all😍

Thanks for reading this thread. Drop a link of your creations below. I love to check them out

More from Pratham 👨‍💻🚀

5 amazing GitHub repositories for every self taught developer

A Thread 🧵

1️⃣ Computer Science

🎓 Path to a free self-taught education in Computer Science!

🔗
https://t.co/67jB5zqIes


2️⃣ Free Certifications

Curated list of free courses & certifications

🔗 https://t.co/4XtlAVlovs


3️⃣ Free Programming Books

📚 Freely available programming books

🔗 https://t.co/eOWLCtwtIV


4️⃣ JavaScript Question

A long list of (advanced) JavaScript questions, and their explanations ✨

🔗 https://t.co/UvEl1Esvh3
I've brought you some amazing GitHub repositories of web development tips and tricks 🌟

THREAD🧵🔽

1️⃣ JS Tips

- A huge list of 73 great tips and tricks of JavaScript

🔗
https://t.co/r0J9vW8WrH


2️⃣ CSS Protips

- A collection of tips to help take your CSS skills pro. Definitely check it out

🔗 https://t.co/5haB2xTWuz


3️⃣ JS Tips and Tricks

- Some advanced tips and tricks of JavaScript that can help you to take your skills onto next level

🔗 https://t.co/NvfoANwweV


4️⃣ Git Tips

- Git is an essential tool for very programmer. in this repo you'll find the most commonly used git tips and tricks

🔗 https://t.co/34qvOhYCZE
Five free VS Code extensions that will change the way you do web development:

1. RapidAPI Client

Fulfill all your need for API development.

• Test and consume APIs
• Work with your VS Code theme
• Generate TypeScript, Swift, and Python interfaces from responses.

🔗
https://t.co/FR0QhyTi8v


2. Better Comments

Create more human-friendly comments in your code.

• Alerts
• Queries
• TODOs
• Highlights

🔗 https://t.co/AV2BwAMAlL


3. Git Graph

View a Git Graph of your repository and efficiently perform Git actions from the graph.

🔗 https://t.co/S5wagmTgsa


4. Peacock

Do you have a habit of keeping multiple VS Code windows open?

Peacock lets you change the color of your VS code even if multiple instances are open.

🔗 https://t.co/bmidPkTQOK

More from Software

As the year wrap's up, let's run through some of the worst public security mistakes and delays in fixes by AWS in 2020. A thread.

First, that time when an AWS employee posted confidential AWS customer information including including AWS access keys for those customer accounts to


Discovery by @SpenGietz that you can disable CloudTrail without triggering GuardDuty by using cloudtrail:PutEventSelectors to filter all events.


Amazon launched their bug bounty, but specifically excluded AWS, which has no bug bounty.


Repeated, over and over again examples of AWS having no change control over their Managed IAM policies, including the mistaken release of CheesepuffsServiceRolePolicy, AWSServiceRoleForThorInternalDevPolicy, AWSCodeArtifactReadOnlyAccess.json, AmazonCirrusGammaRoleForInstaller.
The Great Software Stagnation is real, but we have to understand it to fight it. The CAUSE of the TGSS is not "teh interwebs". The cause is the "direct manipulation" paradigm : the "worst idea in computer science" \1


Progress in CS comes from discovering ever more abstract and expressive languages to tell the computer to do something. But replacing "tell the computer to do something in language" with "do it yourself using these gestures" halts that progress. \2

Stagnation started in the 1970s after the first GUIs were invented. Every genre of software that gives users a "friendly" GUI interface, effectively freezes progress at that level of abstraction / expressivity. Because we can never abandon old direct manipulation metaphors \3

The 1990s were simply the point when most people in the world finally got access to a personal computer with a GUI. So that's where we see most of the ideas frozen. \4

It's no surprise that the improvements @jonathoda cites, that are still taking place are improvements in textual representation : \5

You May Also Like

The entire discussion around Facebook’s disclosures of what happened in 2016 is very frustrating. No exec stopped any investigations, but there were a lot of heated discussions about what to publish and when.


In the spring and summer of 2016, as reported by the Times, activity we traced to GRU was reported to the FBI. This was the standard model of interaction companies used for nation-state attacks against likely US targeted.

In the Spring of 2017, after a deep dive into the Fake News phenomena, the security team wanted to publish an update that covered what we had learned. At this point, we didn’t have any advertising content or the big IRA cluster, but we did know about the GRU model.

This report when through dozens of edits as different equities were represented. I did not have any meetings with Sheryl on the paper, but I can’t speak to whether she was in the loop with my higher-ups.

In the end, the difficult question of attribution was settled by us pointing to the DNI report instead of saying Russia or GRU directly. In my pre-briefs with members of Congress, I made it clear that we believed this action was GRU.