# Comic Book Colors

**URL:** https://discourse.processing.org/t/comic-book-colors/1824
**Category:** Gallery
**Created:** [July 16, 2018, 5:45pm UTC](https://discourse.processing.org/t/comic-book-colors/1824 "2018-07-16T17:45:33Z")
**Posts on this page:** 5
**Page:** 1

<div class="post-metadata">

### Author: ![Kevin](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kevin/32/2297_2.png) [@Kevin](https://discourse.processing.org/u/Kevin)
#### Post date: [July 16, 2018, 5:45pm UTC](https://discourse.processing.org/t/comic-book-colors/1824/1 "2018-07-16T17:45:33Z")

</div>

I recently put together a visualization that takes the first 100 pages of various comic books and shows the colors used by them.

> **[Comic Book Colors](https://happycoding.io/gallery/comic-book-colors/)**
>
> Color is very important to comic books- here's why!

For example here is Saga:

![](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/1X/b04f8aa84c27a0a2d82113c25eed370a7b4530b8.png)

And here is Pretty Deadly:

![](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/1X/4b7bc0a5a5551b669a8ec512804e619a79953b2b.png)

It’s really interesting to compare how different artists use colors, and how colors plays a role in the stories told by comic books.

I used a combination of Processing and P5.js to put the visualization together. [Here](http://happycoding.io/gallery/comic-book-colors/about.html) is a discussion on the process, and [here](http://happycoding.io/gallery/comic-book-colors/code.html) is the code I used.

---

<div class="post-metadata">

### Author: ![jb4x](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jb4x/32/789_2.png) [@jb4x](https://discourse.processing.org/u/jb4x)
#### Post date: [July 16, 2018, 6:09pm UTC](https://discourse.processing.org/t/comic-book-colors/1824/2 "2018-07-16T18:09:05Z")

</div>

Really interesting process, and very well done!

---

<div class="post-metadata">

### Author: ![kfrajer](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kfrajer/32/196_2.png) [@kfrajer](https://discourse.processing.org/u/kfrajer)
#### Post date: [July 16, 2018, 10:19pm UTC](https://discourse.processing.org/t/comic-book-colors/1824/3 "2018-07-16T22:19:35Z")

</div>

Why is there white line between the colors? Can you comment on your approach, for instance, if somebody wants to reproduce your results?

Maybe somebody could do a frequency study of music/sounds this way. Next time somebody is looking for a topic, I will bring this one forward.

Kf

---

<div class="post-metadata">

### Author: ![Kevin](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kevin/32/2297_2.png) [@Kevin](https://discourse.processing.org/u/Kevin)
#### Post date: [July 16, 2018, 10:27pm UTC](https://discourse.processing.org/t/comic-book-colors/1824/4 "2018-07-16T22:27:32Z")

</div>

It’s not that there are white lines between the colors. It’s that white is one of the colors used by many pages. Each page was converted into 4 representative colors, and many pages contain a good amount of white.

If you want more info, check out the two links at the bottom of my first post. This includes my process and the code I used. 🐈

---

<div class="post-metadata">

### Author: ![makoho](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/makoho/32/2176_2.png) [@makoho](https://discourse.processing.org/u/makoho)
#### Post date: [September 21, 2018, 7:59am UTC](https://discourse.processing.org/t/comic-book-colors/1824/5 "2018-09-21T07:59:27Z")

</div>

Very interesting! I like your way to apply k-means to all colors on a page to come up with something else than just an average.
