# Embedding Workouts using Web Component > Source: > Published: 2026-08-16 16:15:06+00:00 # Embedding Workouts using Web Component I wanted a way to represent workouts by the muscle groups they activate. Most applications where you log do it. I thought it must be easy with SVG images. It wasn’t as easy. First, I had to get an image that is remake-friendly. I used this [drawing](https://commons.wikimedia.org/w/index.php?curid=94071041) by *OpenStax & Tomáš Kebert & umimeto.org*, from Wikimedia Commons. Cleaned it up to reduce the complexity. Then tagged each muscle group, including separating left and right muscles, in case you focus on one side. After that, I wanted an easy way to embed it on any web page. I chose to use web components. It converts the given list of exercises into muscle groups, then applies styles to them within the SVG and embeds the SVG. I have verified it to the best of my knowledge and from available sources. It took a lot of battling with Claude to make it the way I want, that is, to make it generic and reusable. I still have to map a bunch of muscle groups, I have listed all the [short comings in the readme](https://github.com/thejeshgn/muscle-map). Finally, I created a WordPress shortcode to queue the JavaScript and embed the component. But that’s not really required. If you have a simple static site, then you can include SVG and a JS file and use the [muscle-map](https://github.com/thejeshgn/muscle-map) tag in your HTML #### Wednesday Workout #### Run #### Calf raise, Tibialis raise #### Calf raise Happy workout and happy logging.