Review a CSS Art Tutorial with CodeHS!

🎨 CSS Art

Cascading Style Sheets (CSS) has become a powerful styling language for web designers and developers. Web designers use CSS to manipulate shapes, colors, and typography. CSS rules can create animated sequences and visual effects. They can even provide web users with visual feedback when they interact with a web element, such as a button or menu.

Madeline Floating in the Sky (pure CSS) - by anniebombanie

Creative coders can use a variety of languages to produce incredible art. With a little HTML and some CSS, artists and designers create fun, interactive, and sometimes realistic visuals for the web. Some web designers have created fully interactive sites using CSS animations. Check out this amazing site by Martin Gauer that uses CSS and some JavaScript to create an online handheld gaming emulator.

Your students can start creating their own CSS art in their CodeHS Sandbox. This CSS Art tutorial includes some basic snippets of CSS to get them started with making shapes, color gradients, and basic animations. The tutorial helps students practice styling, positioning, and animating various shapes in CSS to create a fun emoji. Challenges are presented at the end of the tutorial to get students thinking about other ways they can customize their emoji and ideas for creating their own CSS art!

CSS Art Tutorial

🪤 Catch Me Project

Level-up your HTML and CSS skills with this additional web design project on the CodeHS Project Catalog. Students create a web-based game using HTML and CSS (plus JavaScript code that’s given to them). The object of the game is to click on a moving image to gain points.

Explore Here

🔍 Inspector Debug

Stuck trying to figure out where your students’ CSS went awry? Web page layouts are easier to debug using Chrome’s built-in Dev Tools!

In this blog, you’ll learn more about how to identify potential problems when reviewing web pages and leverage the Chrome browser’s Developer Tools Inspector.

Visit the ReadWriteCode Blog

2024 Virtual Teacher Conference

Registration for the CodeHS Virtual Teacher Conference is now open! We have an amazing lineup of speakers, including CS teachers from across the country and experts from CodeHS. Attendees will receive a CodeHS Pro Trial through June 30th, 2024, a $20 Amazon gift card, and a digital swag bag! Explore session topics and register at codehs.com/virtualcon2024-register.

🧠 CodeHS Pro Tool Highlight: AI Hints

AI is a powerful tool that can help teachers identify learning needs, streamline their workflows, and provide targeted feedback.

CodeHS has recently launched AI Hints on Pro! This new tool identifies student errors and allows teachers to generate suggested hints they can provide students. CodeHS AI tools are currently in beta for Pro teachers.

Learn More

Upgrade to Pro today to explore how the power of AI can help your students learn.

📅 PD Webinars & Workshops

Throughout the year, we host free webinars and workshops designed to help teachers learn more about the CodeHS platform and additional tools that can be used in the classroom.

Stay tuned for upcoming webinars and workshops on our website, but in the meantime, you can browse our available content on our YouTube channel.

Available Webinars

📈 Coding in the Wild Blog

The Coding the Wild posts are great for showcasing how professionals use computer science across multiple disciplines. They're great to use for supplemental material or extra credit in class.

“Be inquisitive. Don’t be afraid to start experimenting and tinkering with code," shares Steven Tidd, Software Engineer for the federal government.

Coding for Government