Emoji-based coding tool demystifies web design and animation

Learning rating

Community rating

Not yet reviewed
Based on 0 review

Privacy rating

Expert evaluation by Common Sense


Price: Free to try
Platforms: Web

Pros: Sequential lessons on core web technologies, great tutorials, and instant access to student-made websites and animations.

Cons: Design elements are limited to images, videos, and sounds contained in Codemoji; teacher dashboard can be buggy.

Bottom Line: Emoji-based lessons engage and empower kids to explore web design and animation, with instant website creation.

Codemoji is an engaging tool that helps teachers guide students through the main coding technologies that drive websites: HTML, CSS, and JavaScript. It's ideal to supplement direct instruction as an option for flipped or blended classrooms or for an after-school enrichment program or summer camp offering. In terms of content, Codemoji easily fits into a computer science, STEM, or media arts course.

Students can work individually or collaboratively: Though they can jump right into the Play area, it's best that they check out some of the beginner courses first. But once they get their footing, turn them loose into the sandbox area that fits their interests and skill level. If you want to take learning offline, you can have kids practice computational thinking by writing a series of steps for each other to follow exactly.


With Codemoji, the inner workings of websites are demystified as students get hands-on experience building webpages and animations. In the Learn area, students can access courses that start from basic and extend to expert level. Each lesson starts with step-by-step, multimodal instructions: text and a computerized text-to-speech option, followed by drag-and-drop animated instructions showing Codemoji moving from the Emoji Box into the Text Editor (in HTML lessons only).

Once they have some basic understanding, they can go to the Play area, which has three choices: Code, Workshop, and Playground. The Code area requires text-based coding knowledge, while the Workshop lets kids play around with basic animation commands. The Playground area contains the "emoji" part of Codemoji: a library of relatable emoticons that represent specific, text-based commands in HTML, CSS, and JavaScript (for example, an HTML head tag is represented by a panda head emoji). Emojis are strung together to create lines of code that follow standard coding logic and syntax. Run the Codemoji in the Live Display box to instantly see the webpage or animation in action. The Show Tags tab displays the text version of the code. Students can run and get instant feedback on their code and progress at their own speed. There's a live-chatting feature, several how-to videos on YouTube, and a Codemoji Facebook page for additional resources. With a subscription, teachers have access to a dashboard to track student progress and can download pre-made lessons.

Codemoji is a solid intro to web coding that's icon-based. Cumbersome coding text is transformed into a relatable emoji, and each emoji function is taught conceptually. There's no need to memorize strings of code, be a proficient typist, or have a deep understanding of coding syntax. This is especially helpful for emerging typists, ELLs, and visually based learners. Students can work at their own pace, have access to clear, multimodal instructions, and instantly see webpages and animations their code creates.

Codemoji is mostly drag-and-drop, and students can opt to add text into HTML code (to customize titles, for instance). That said, they'll be required to enter text and numbers in CSS and JavaScript lessons to specify certain commands, such as assigning color and animation coordinates. It's easy to run code, see it in action, get feedback, and showcase creations. It's great that students can jump in without an account, but teachers will have to pay to get access to lessons and the dashboard. And it's helpful that different skill levels are addressed in one tool. The simplicity of the icons and animations probably won't thrill older elementary schoolers, but it's a solid entry into the world of coding.

Learning Rating

Overall Rating

The relatable emoji commands reduce the need for typing skills, memorizing functions, and clunky syntax. Instead, Codemoji makes HTML, CSS, and JavaScript intuitive for young coders.


Web design is made clear by Codemoji's visually based, drag-and-drop learning tool. Kids create webpages and animations in real time and develop intuitive skills that are the building blocks of today's websites.


Lessons start with multimodal instruction. Along the way, kids see their emoji-based code turn into a webpage or animation. Codemoji offers email and live chat support and has several how-to videos on YouTube.

Common Sense reviewer
Kim A.
Kim A. Educational Technology Specialist

Community Rating

No one has reviewed this tool yet. Be the first to share your thoughts.

Write a review

Privacy Rating

Data Safety How safe is this product?

  • Unclear whether this product supports interactions between trusted users.
  • Unclear whether personal information can be displayed publicly.
  • Unclear whether user-created content is filtered for personal information before being made publicly visible.

Data Rights What rights do I have to the data?

  • Unclear whether users can create or upload content.
  • Processes to access or review user data are available.
  • Processes to modify data are available for authorized users.

Ads & Tracking Are there advertisements or tracking?

  • Personal information is shared for third-party marketing.
  • Unclear whether this product displays traditional or contextual advertisements.
  • Unclear whether this product displays personalised advertising.

Continue reading about this tool's privacy practices, including data collection, sharing, and security.

See complete evaluation

Learn more about our privacy ratings