playCSS - Improve your CSS skills by playing daily challenges

byβ€’
Recreate daily target images in pure CSS and test your UI design skills while having fun πŸ”₯ Submit your works, share them anywhere you want, and get votes to scale high on the Leaderboard πŸš€

Add a comment

Replies

Best
Maker
πŸ“Œ
Hi everybody! It's been a long time I haven't built a side project, so I've recently decided to combine my game dev skills with my love for CSS, and created playCSS! Here’s a video preview: This tool is a fun way to test and improve your web design skills by recreating random images with pure HTML/CSS code in the live editor, a new challenge every day. You can submit your works so that they will be visible on the "Today Submissions" page. Share them with your audience and get votes to scale high on the Leaderboard πŸš€ playCSS is free, and it will always be free to play and submit daily challenges. With a PRO subscription you'll get the following benefits: - Play past Challenges - View the code of other players' Submissions (and your own ones as well) - Code Editor with Autocompletion, Themes and Compare feature - A nice shiny PRO badge I hope you'll have fun playing with this tool, any feedback will be greatly appreciated!
One of my best serial makers! Go Frank go!
Thanks so much, Csaba! ❀️‍πŸ”₯
Wow, what a fantastic concept! As someone always looking to improve their CSS skills, I love playing daily challenges to enhance my UI design abilities. I'm curious: does playCSS provide any resources or tutorials for beginners just starting with CSS? It would be great to have some guidance, learning materials, and challenges. Also, it would be fantastic if a feature allowed users to leave feedback on each other's submissions. Feedback is a valuable tool for growth and improvement, and it would be interesting to see how the community could support each other in this way. Overall, I'm excited to try out playCSS and see how it can help me improve my CSS skills. Kudos to the team for creating such a fun and interactive learning platform! πŸ™Œ
Thanks for your feedback, really appreciated! For now there are no learning resources, but I’ll add something in the future. Also, you can share your works to social medias, email, etc., so that you can get a feedback from where you shared your creations ;)
I'd like to +1 for some sort of learning resource. My first thought was "Oh, a daily challenge I can do instead of soduku to wake up my brain", but one glance at it and I realised I'm way out of my depth when it comes to my css skillset. And then I thought "Well, no worries, I'll just look at submissions from other people and figure out how to do it", but there was only one submission for today (seems low considering PH launch?) and then I had to go pro to see the source... and then go pro to see previous submissions. I feel like the paygate needs rethinking. I'm not saying not to have one, it just feels like the sort of thing where I'd like to be able to do a bit more before I pay, but my css skills are pretty basic so perhaps I'm not the right target of this. Also, from a UX perspective if you go to Past Challenges and click "Play Now (Pro)", or the little play button, it doesn't do anything. My expectation is that it should pop up a little box that says "unlock past challenges for just $5/mo" or whatever your pricing is - but I can't see pricing anywhere, and I have to click on anything except the play button to open the sign-up interface.
Thanks for your feedback, anyway that’s weird, if you’re not a PRO member and click on a Past target, an alert shows up asking you to get Pro, with a button that takes you to the pricing and list of benefits. What browser are you using, out of curiosity?
Chrome, Windows 10. If you click on the past target it asks me to sign in/sign up, but if you click on the button on the target it has no action. Just checked in Edge as well, same issue. Here, I made a quick video:
Oh yeah, thanks for pointing out, I'll fix it right away ;)
I thought I would be a new challenger but I litterally have no idea how to code those things...
Take it as a fun way to learn CSS, search on w3schools for CSS position, background and color attributes, that’s what you’ll basically need to get started, then experiment in the playCSS editor, and win πŸ˜‰
I'll definitely give it a try
Awesome πŸ‘
sounds fun!
If you love CSS, it’s really a fun place to test snd showcase your skills πŸ˜‰
I'm all in for gamification intertwined with education πŸ˜πŸ‘πŸ‘πŸ‘ Really enjoyed your product guys. Nothing seemed out of ordinary! Congratulations on the launch!πŸ™ŒπŸŽ‰πŸŽ‰
Thanks so much, glad you like it!
Great idea! Best of luck Frank!
Glad you like the tool, Fernando! πŸ™
What a fun way to practice CSS. Great work Frank. Good luck with the launch
Thanks Lucian, happy you like this tool! ❀️‍πŸ”₯
Good luck, guys! Gamifying education is the way to go!
Thanks Vasily!
Gonna try it out. Congratulations on the launch, Frank.
Thanks! Hope you’ll have fun, wanna see your name in the Leaderboard as well πŸ†
Great idea guys - learning is always personal but not many can argue that learning as a habit isn't good. Much better use of my time than doomscolling - all whilst learning CSS!
Glad you like this tool! Wanna see you climb the Leaderboard ;)
12
Next
Last