30 Days of CSS Girls

January 19, 2019



We’ll publish a challenge on alternate days with our sample provided on Codepen, but you’re free to choose your own. Those projects were built on inspiration from Dribbble or designs we find in daily life.

Daily Checklist

  • Create your Codepen and tag #30DaysOfCSSGirls.
  • If you’re implementing someone else’s design, kindly give a reference to the original design. You may do so in your CodePen’s description or comment in the code.
  • Feel free to tweet and share your project to the world and tag #30DaysOfCSSGirls.
  • Every other day, we will select a best project to be featured on CodingGirls Facebook Page

Q&A Channel https://codinggirls-workspace.slack.com/ Feel free to post any questions you have on our slack channel

Judging criteria

At end of the 30 days, there will be a lucky one to be selected to win a ticket to JSConf.Asia 2019 https://2019.jsconf.asia/ which will be held 14-16 June 2019 in Singapore. Our selection criteria as below

  • completeness: How many projects you have created constantly during the 30 days?
  • creativity: Yes we have provided a sample for you to play around, but it will up to you to do you own variations and have fun with CSS
  • give back: Have you helped by answering questions from your peers? Or sharing your thoughts and feedback to your peers and mentors?


Every other day we’ll slow down on coding and take time to read CSS specifications. You are encouraged to create simple CodePens to try out the things you read from the specs. The specs we’ll read will be a select from CSS Snapshot 2018.

What is CSS Snapshot 2018?

… collects together into one definition all the specs that together form the current state of Cascading Style Sheets (CSS) as of 2018.



Study Materials