Today I bring to you some simple websites to practice CSS and HTML online with live editors. These are also known as CSS and HTML “playgrounds”. It really is just that – a playground. Run around and do whatever you want with your code and see what happens!
These playgrounds are perfect for beginners who want to practice their coding skills and see the changes happen as they are made… with no consequences. 😉
This is probably my most played on playground. Very simple interface with the ability to log in and save your work.
This playground is used in a lot of different forums because you can create something with HTML and CSS and then add collaborators, or send a link to your code to show others what you have done.
Very similar to codepen, except there is only one column to work on both CSS and HTML in the same space.
Developer Tools – Page Inspector
This is one of the most helpful tools I’ve come across when designing WordPress themes. Right click on any element in a web page, click inspect, and you will be able to see the HTML and CSS of the website like you have X-ray vision!
These are great tools to use when you are developing a website, or just want to fix something on your current website and need to mess around with it.
What ways do you practice HTML and CSS online? Do you use any of the editors above? Let me know in the comments below!