CSS Battle

“Great web design is more than pretty pictures”

About: 

CSS Battle is a web design competition. The competition will consist of 3 rounds. You will be judged on the following criteria: Creativity, Design, Clean coding, and Speed. Are you ready to take on the challenge? After all, “simplicity carried to an extreme becomes elegance”.

Description:

Round 1:

• All the participants will receive a raw project and a snapshot of the finished project
• Participants should implement the allotted theme only by changing the contents of the CSS file
• Change in the contents of any file except the intended CSS file will lead to straight disqualification
• Participants who perform better than 50% of the total participant count will advance to the next round

Round 2:

• Participants will receive a video of the finished project. That uses advanced CSS concepts to add a dynamic element to the project.
• Participants should implement it on the same project.
• Change in the contents of any file except the intended CSS file will lead to straight disqualification.
• The top 4 participants will advance to the final round.

Round 3:

• Participants will receive a new theme
• They will build the project from scratch writing their own HTML and CSS code
• They can apply all the CSS features they want to make their project UI better
• Judgement will be based majorly on design and minimally on content

Judgment Criterion:

General design standards (including but not limited to):

• Text Readability
• Paddings & Margins
• Alignment
• Giving a greater "border-radius" to the parent container w.r.t to its child counterpart

CSS Standards (including but not limited to):

• Code Redundancy
• Unnecessary use of "!important"

Submission Time: 

• 30 minutes time for each round
• 5-10 minute break between each round

Rules:

• Bring your own laptops
• Using the Lab system is not allowed
• For each round, an HTML and CSS file will be given and all the elements of HTML DOM will be given proper classes and ids. Your task will be to edit the CSS file only and hence you are not allowed to change the HTML structure or any other change in the HTML file
• No use of CDNs and CSS frameworks like Bootstrap, TailwindCSS etc
• We’ll check for plagiarism in your code, thus you are restricted to using websites like Animista, Codepen etc.   

Point of Contact:

• Aryavir Malik: 9818828810
• Sachin Yadav: 8376996179