13 games for designers
Tags: design, designers, designergames
Published: 2022-10-17 09:17:18

---
title: 13 games for designers
published: true
description: Useful games for designers and developers to play and learn
tags: design, designers, designergames
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qmwj2sx96dc4rg576fzc.gif
# Use a ratio of 100:42 for best results.
---

Here are some games to play to train you eye for the colors, fonts, positioning and even drawing. 

## Design

### [Can’t Unsee](https://cantunsee.space/)
<a href="https://cantunsee.space/" target='_blank'>
<img src='https://barcelonacodeschool.com/files/pics/games_for_designers/Screenshot_2022-10-09_at_10.13.15.jpg' class="fullwidth"/>
</a>


<br/><br/><br/>

### [It’s centered that](https://www.supremo.co.uk/designers-eye/)
<a href="https://www.supremo.co.uk/designers-eye/" target='_blank'>
<img src='https://barcelonacodeschool.com/files/pics/games_for_designers/Screenshot_2022-10-09_at_10.15.03.jpg' class="fullwidth"/>
</a>


<br/><br/><br/>

### [Pixactly](https://pixact.ly/)
<a href="https://pixact.ly/" target='_blank'>
<img src='https://barcelonacodeschool.com/files/pics/games_for_designers/Screenshot_2022-10-09_at_10.17.20.jpg'  class="fullwidth"/>
</a>


<br/><br/><br/>

### [The Bézier Game](https://bezier.method.ac/)
<a href="https://bezier.method.ac/" target='_blank'>
<img src='https://barcelonacodeschool.com/files/pics/games_for_designers/Screenshot_2022-10-09_at_10.23.22.jpg'  class="fullwidth"/>
</a>


<br/><br/><br/>

## Color

### [Kolor](https://kolor.moro.es/)
<a href="https://kolor.moro.es/" target='_blank'>
<img src='https://barcelonacodeschool.com/files/pics/games_for_designers/Screenshot_2022-10-09_at_10.05.48.jpg'  class="fullwidth"/>
</a>


<br/><br/><br/>

### [Hex Invaders](http://www.hexinvaders.com/) 
<a href="http://www.hexinvaders.com/" target='_blank'>
<img src='https://barcelonacodeschool.com/files/pics/games_for_designers/Screenshot_2022-10-09_at_10.06.16.jpg'  class="fullwidth"/>
</a>


<br/><br/><br/>

### [The Color!](https://game.ioxapp.com/eye-test/game.html)
<a href="https://game.ioxapp.com/eye-test/game.html" target='_blank'>
<img src='https://barcelonacodeschool.com/files/pics/games_for_designers/Screenshot_2022-10-09_at_10.07.34.jpg'  class="fullwidth"/>
</a>


<br/><br/><br/>

### [Color matching game](https://color.method.ac/)
<a href="https://color.method.ac/" target='_blank'>
<img src='https://barcelonacodeschool.com/files/pics/games_for_designers/Screenshot_2022-10-09_at_10.22.25.jpg'  class="fullwidth"/>
</a>


<br/><br/><br/>

### [What the hex?](http://yizzle.com/whatthehex/)
<a href="http://yizzle.com/whatthehex/" target='_blank'>
<img src='https://barcelonacodeschool.com/files/pics/games_for_designers/Screenshot_2022-10-09_at_10.09.17.jpg'  class="fullwidth"/>
</a>


<br/><br/><br/>

## Fonts

### [Shape type](https://shape.method.ac/)
<a href="https://shape.method.ac/" target='_blank' >
<img src='https://barcelonacodeschool.com/files/pics/games_for_designers/Screenshot_2022-10-09_at_10.16.01.jpg' class="fullwidth"/>
</a>


<br/><br/><br/>

### [Type connection](http://www.typeconnection.com/step1.php)
<a href="http://www.typeconnection.com/step1.php" target='_blank'>
<img src='https://barcelonacodeschool.com/files/pics/games_for_designers/Screenshot_2022-10-09_at_10.10.20.jpg'  class="fullwidth"/>
</a>


<br/><br/><br/>

### [Better Web Type](https://betterwebtype.com/triangle/)
<a href="https://betterwebtype.com/triangle/" target='_blank'>
<img src='https://barcelonacodeschool.com/files/pics/games_for_designers/Screenshot_2022-10-09_at_10.11.12.jpg'  class="fullwidth"/>
</a>


<br/><br/><br/>

### [Kerntype](https://type.method.ac/)
<a href="https://type.method.ac/" target='_blank' >
<img src='https://barcelonacodeschool.com/files/pics/games_for_designers/Screenshot_2022-10-09_at_10.21.57.jpg' class="fullwidth"/>
</a>