diff --git a/src/app/pages/customization/background.component.ts b/src/app/pages/customization/background.component.ts
index 8867c80..5ed0140 100644
--- a/src/app/pages/customization/background.component.ts
+++ b/src/app/pages/customization/background.component.ts
@@ -9,12 +9,14 @@ declare var UIkit;
     <color [color]="background.color"
            [label]="label" [light]="light"
            (colorChange)=
-             " background.color = $event;"></color>
+             " background.color = $event;" [description]="description"></color>
+
   `
 })
 
 export class BackgroundComponent implements OnInit {
   @Input() label:string = "";
+  @Input() description:string = null;
   @Input() background;
   @Input() oldBackground;
   @Input() light:boolean;
diff --git a/src/app/pages/customization/color.component.ts b/src/app/pages/customization/color.component.ts
index 115c6ef..f2fb9cd 100644
--- a/src/app/pages/customization/color.component.ts
+++ b/src/app/pages/customization/color.component.ts
@@ -11,9 +11,12 @@ import {CustomizationOptions} from '../../openaireLibrary/connect/community/Cust
           <input class="uk-margin-small-left color-input" color-picker [colorPicker]="color"   [style.background]="color"
                  (colorPickerChange)="color=$event; colorChanged();"/>
         </div>
-        <div class="uk-margin-small-left"> {{label}}</div>
+        <div class="uk-margin-small-left"> {{label}}
+          <div class="uk-text-meta uk-text-xsmall" *ngIf="description" >{{description}}</div>
+        </div>
       </div>
-    </div>
+    </div>    
+
     <div class="uk-text-warning uk-text-xsmall uk-margin-small-left" *ngIf="warningForContrast(color)">Contrast ratio may be too low.</div>
   `,
   styles:[
@@ -35,6 +38,7 @@ export class ColorComponent implements OnInit {
   @Input() addMargin: boolean = false;
   @Output() colorChange = new EventEmitter();
   @Input() light:boolean;
+  @Input() description:string = null;
   public warningForContrast(color:string){
     return (this.light &&  CustomizationOptions.isForLightBackground(color)) || (!this.light && !CustomizationOptions.isForLightBackground(color));
   }
diff --git a/src/app/pages/customization/customization.component.html b/src/app/pages/customization/customization.component.html
index 2df026f..ff0e748 100644
--- a/src/app/pages/customization/customization.component.html
+++ b/src/app/pages/customization/customization.component.html
@@ -213,12 +213,12 @@
                   [light]="false"></background>
       <background label="Light" [background]="draftCustomizationOptions.backgrounds.light"
                   [light]="true"></background>
-      <background label="Hero" [background]="draftCustomizationOptions.backgrounds.form"
+      <background label="Hero section" [background]="draftCustomizationOptions.backgrounds.form"
                   [light]="true"
                   [oldBackground]="publishedCustomizationOptions.backgrounds.form"
-                  [communityId]="communityId"></background>
+                  [communityId]="communityId" description="The area under menu"></background>
       <div class="uk-margin-xsmall-bottom uk-text-uppercase uk-text-meta uk-text-bold uk-margin-large-top">
-        Hero Image
+        Hero section image
         <a *ngIf="(formHasChanges(publishedCustomizationOptions, draftCustomizationOptions)  )
                   && draftCustomizationOptions.backgroundsIsCustom"
            (click)="resetImageTo(publishedCustomizationOptions.backgrounds);" class="uk-margin-small-left"