diff --git a/src/app/modules/colors/pages/list/list.component.html b/src/app/modules/colors/pages/list/list.component.html
index 72e59aa..6c00852 100644
--- a/src/app/modules/colors/pages/list/list.component.html
+++ b/src/app/modules/colors/pages/list/list.component.html
@@ -11,8 +11,11 @@
   </div>
 </div>
 
-<mat-expansion-panel class="table-title" *ngFor="let companyRecipes of (recipes$ | async)"
-                     [hidden]="isCompanyHidden(companyRecipes.recipes)" [expanded]="panelForcedExpanded">
+<mat-expansion-panel
+  class="table-title"
+  *ngFor="let companyRecipes of (recipes$ | async)"
+  [hidden]="isCompanyHidden(companyRecipes.recipes)"
+  [expanded]="panelForcedExpanded">
   <mat-expansion-panel-header>
     <mat-panel-title>
       {{companyRecipes.company}}
@@ -40,7 +43,8 @@
     <ng-container matColumnDef="color">
       <th mat-header-cell *matHeaderCellDef>Couleur</th>
       <td mat-cell *matCellDef="let recipe">
-        <div class="recipe-color-circle" [class.light-mode]="isLightColor(recipe)" [style.backgroundColor]="recipe.color"></div>
+        <div class="recipe-color-circle" [class.light-mode]="isLightColor(recipe)"
+             [style.backgroundColor]="recipe.color"></div>
       </td>
     </ng-container>
 
diff --git a/src/app/modules/colors/pages/list/list.component.ts b/src/app/modules/colors/pages/list/list.component.ts
index 0476275..68fd86e 100644
--- a/src/app/modules/colors/pages/list/list.component.ts
+++ b/src/app/modules/colors/pages/list/list.component.ts
@@ -41,7 +41,7 @@ export class ListComponent extends ErrorHandlingComponent {
     }
     const positive = this.searchString(recipe.name) ||
       this.searchString(recipe.description) ||
-      this.searchString(recipe.sample.toString())
+      (recipe.sample && this.searchString(recipe.sample.toString()))
     this.recipesHidden[recipe.id] = !positive
     return positive
   }