diff --git a/src/controller/product/Product.php b/src/controller/product/Product.php
index a2c5701..7493c9f 100644
--- a/src/controller/product/Product.php
+++ b/src/controller/product/Product.php
@@ -3,6 +3,8 @@ namespace controller\product;
 
 use controller\AbstractController;
 use repository\product\Product as ProductRepository;
+use core\Core;
+use router\Link;
 
 /**
  *
@@ -11,14 +13,41 @@ use repository\product\Product as ProductRepository;
  */
 final class Product extends AbstractController implements ProductInterface
 {
-    public function list(): void
+
+    /**
+     *
+     * @var ProductRepository
+     */
+    protected $productRepository;
+
+    public function __construct(Core $core)
     {
-        $productRepository = new ProductRepository($this->core->getDatabase());
-        $this->render('product/list.html.twig',['products'=>$productRepository->getAllProducts()->toArray()]);
+        parent::__construct($core);
+        $this->productRepository = new ProductRepository($this->core->getDatabase());
     }
 
-    public function colorFilter(string $color): void
-    {}
+    public function list(?string $color = null): void
+    {
+        if ($color) {
+            $products = $this->productRepository->getAllByColor($color)->toArray();
+        } else {
+            $products = $this->productRepository->getAllProducts()->toArray();
+        }
+        $this->render('product/list.html.twig', [
+            'products' => $products,
+            'colors' => $this->getColors()
+        ]);
+    }
 
+    private function getColors(): array
+    {
+        $colors = [];
+        foreach ($this->productRepository->getColors() as $color) {
+            $parameters = $_GET;
+            $parameters['color'] = $color['color'];
+            $colors[] = new Link($parameters, $color['color']);
+        }
+        return $colors;
+    }
 }
 
diff --git a/src/controller/product/ProductInterface.php b/src/controller/product/ProductInterface.php
index eff3608..84848c2 100644
--- a/src/controller/product/ProductInterface.php
+++ b/src/controller/product/ProductInterface.php
@@ -7,13 +7,6 @@ namespace controller\product;
  */
 interface ProductInterface
 {
-    /**
-     * An own Class filter would be better, 
-     * but it's to abstract for this concrete exampl ;)
-     * @param string $color
-     */
-    public function colorFilter(string $color):void;
-    
-    public function list():void;
+    public function list(?string $color = null):void;
 }
 
diff --git a/src/repository/product/Product.php b/src/repository/product/Product.php
index bc1e219..6469a5d 100644
--- a/src/repository/product/Product.php
+++ b/src/repository/product/Product.php
@@ -48,15 +48,27 @@ final class Product extends AbstractRepository implements ProductInterface
         }
     }
 
+    public function getColors(): array
+    {
+        $statement = $this->database->prepare('SELECT DISTINCT color FROM product;');
+        $statement->execute();
+        return $statement->fetchAll();
+    }
+
+    private function transformFetchToArrayCollection(array $fetch): ArrayCollection
+    {
+        $products = new ArrayCollection();
+        foreach ($fetch as $product) {
+            $products->add($this->createProduct($product['name'], $product['color'], $product['price'], $product['tax'], $product['image']));
+        }
+        return $products;
+    }
+
     public function getAllProducts(): ArrayCollection
     {
         $statement = $this->database->prepare('SELECT * FROM ' . self::TABLE . ';');
         $statement->execute();
-        $products = new ArrayCollection();
-        foreach ($statement->fetchAll() as $product) {
-            $products->add($this->createProduct($product['name'], $product['color'], $product['price'], $product['tax'], $product['image']));
-        }
-        return $products;
+        return $this->transformFetchToArrayCollection($statement->fetchAll());
     }
 
     static public function createProduct(string $name, string $color, int $cents, int $tax, string $imagePath): ProductEntity
@@ -76,6 +88,10 @@ final class Product extends AbstractRepository implements ProductInterface
         return $product;
     }
 
-    public function getProductById(int $id): ProductEntityInterface
-    {}
+    public function getAllByColor(string $color): ArrayCollection
+    {
+        $statement = $this->database->prepare('SELECT * FROM ' . self::TABLE . ' WHERE color = ?;');
+        $statement->execute([$color]);
+        return $this->transformFetchToArrayCollection($statement->fetchAll());
+    }
 }
\ No newline at end of file
diff --git a/src/repository/product/ProductInterface.php b/src/repository/product/ProductInterface.php
index 7c6c036..f68af9c 100644
--- a/src/repository/product/ProductInterface.php
+++ b/src/repository/product/ProductInterface.php
@@ -2,7 +2,7 @@
 namespace repository\product;
 
 use Doctrine\Common\Collections\ArrayCollection;
-use entity\product\ProductInterface as ProductEntityInterface;
+
 /**
  *
  * @author kevinfrantz
@@ -14,6 +14,8 @@ interface ProductInterface
     
     public function addProducts(ArrayCollection $products):void;
     
-    public function getProductById(int $id):ProductEntityInterface;
+    public function getColors():array;
+    
+    public function getAllByColor(string $color):ArrayCollection;
 }
 
diff --git a/src/router/Router.php b/src/router/Router.php
index 7143a8a..a4cb004 100644
--- a/src/router/Router.php
+++ b/src/router/Router.php
@@ -53,9 +53,7 @@ final class Router implements RouterInterface
                     $productController = new Product($this->core);
                     switch ($this->get['action']) {
                         case 'list':
-                            return $productController->list();
-                        case 'color':
-                            return $productController->colorFilter($this->get['color']);
+                            return $productController->list(($this->get['color'])?$this->get['color']:null);
                     }
                 case 'order':
                     $orderController = new Order($this->core);
diff --git a/src/template/frames/default.html.twig b/src/template/frames/default.html.twig
index a4cae94..7f97a84 100644
--- a/src/template/frames/default.html.twig
+++ b/src/template/frames/default.html.twig
@@ -3,6 +3,7 @@
 <div class="container">
 	<div class="page-header">
 		<h1>Online Shop</h1>
+		<hr />
 	</div>
 	{% block content %}
 	{% endblock %}
diff --git a/src/template/product/list.html.twig b/src/template/product/list.html.twig
index 114d380..d820088 100644
--- a/src/template/product/list.html.twig
+++ b/src/template/product/list.html.twig
@@ -1,6 +1,17 @@
 {% extends 'frames/default.html.twig' %}
 {% block title %}product overview{% endblock %}
 {% block content %}
+<div class="dropdown">
+  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+    filter by color:
+  </button>
+  <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+    {% for color in colors %}
+    	<a class="dropdown-item" href="{{ color.getUrl }}">{{ color.getName }}</a>
+    {% endfor %}
+  </div>
+</div>
+<hr />
 <div class="card-columns">
 	{% for product in products %}
 	<div class="card" style="width: 18rem;">