diff --git a/demo/src/app/context/context/context.component.html b/demo/src/app/context/context/context.component.html
index da98a5331f..0a7b6724f9 100644
--- a/demo/src/app/context/context/context.component.html
+++ b/demo/src/app/context/context/context.component.html
@@ -16,7 +16,7 @@
     [map]="map">
     <igo-zoom-button [map]="map" color="primary"></igo-zoom-button>
     <igo-geolocate-button [map]="map" color="primary"></igo-geolocate-button>
-    <igo-rotation-button [map]="map" color="primary"></igo-rotation-button>
+    <igo-rotation-button [map]="map" [showIfNoRotation]="true" color="primary"></igo-rotation-button>
   </igo-map-browser>
 
   <igo-panel title="Contexts list">
diff --git a/demo/src/app/geo/directions/directions.component.html b/demo/src/app/geo/directions/directions.component.html
index 06b50a544b..2503a807c7 100644
--- a/demo/src/app/geo/directions/directions.component.html
+++ b/demo/src/app/geo/directions/directions.component.html
@@ -12,7 +12,7 @@
   <igo-map-browser [map]="map" [view]="view">
     <igo-zoom-button [map]="map" color="primary"></igo-zoom-button>
     <igo-geolocate-button [map]="map" color="primary"></igo-geolocate-button>
-    <igo-rotation-button [map]="map" color="primary"></igo-rotation-button>
+    <igo-rotation-button [map]="map" [showIfNoRotation]="false" color="primary"></igo-rotation-button>
   </igo-map-browser>
 
   <igo-routing-form [map]="map"></igo-routing-form>
diff --git a/demo/src/app/geo/print/print.component.html b/demo/src/app/geo/print/print.component.html
index d24a411dd5..c7865faf9d 100644
--- a/demo/src/app/geo/print/print.component.html
+++ b/demo/src/app/geo/print/print.component.html
@@ -18,7 +18,7 @@
   <igo-map-browser [map]="map" [view]="view">
     <igo-zoom-button [map]="map" color="primary"></igo-zoom-button>
     <igo-geolocate-button [map]="map" color="primary"></igo-geolocate-button>
-    <igo-rotation-button [map]="map" color="primary"></igo-rotation-button>
+    <igo-rotation-button [map]="map" [showIfNoRotation]="false" color="primary"></igo-rotation-button>
   </igo-map-browser>
 
   <igo-print [map]="map"></igo-print>
diff --git a/demo/src/app/geo/simple-map/simple-map.component.html b/demo/src/app/geo/simple-map/simple-map.component.html
index 716527e633..a865626c32 100644
--- a/demo/src/app/geo/simple-map/simple-map.component.html
+++ b/demo/src/app/geo/simple-map/simple-map.component.html
@@ -12,7 +12,7 @@
   <igo-map-browser [map]="map" [view]="view">
     <igo-zoom-button [map]="map" color="primary"></igo-zoom-button>
     <igo-geolocate-button [map]="map" color="primary"></igo-geolocate-button>
-    <igo-rotation-button [map]="map" color="primary"></igo-rotation-button>
+    <igo-rotation-button [map]="map" [showIfNoRotation]="true" color="primary"></igo-rotation-button>
   </igo-map-browser>
 
 </mat-card>
diff --git a/packages/geo/src/lib/map/rotation-button/rotation-button.component.html b/packages/geo/src/lib/map/rotation-button/rotation-button.component.html
index b4a8475d4b..1ab5abf982 100644
--- a/packages/geo/src/lib/map/rotation-button/rotation-button.component.html
+++ b/packages/geo/src/lib/map/rotation-button/rotation-button.component.html
@@ -1,10 +1,17 @@
-<div class="igo-rotation-button-container">
-  <button
-    *ngIf="map.viewController.getRotation() !== 0" 
-    mat-icon-button 
-    [matTooltip]="'igo.geo.mapButtons.resetRotation' | translate"
-    matTooltipPosition="left" 
-    [color]="color" 
+<div *ngIf="rotated && !showIfNoRotation" class="igo-rotation-button-container"
+  [matTooltip]="rotated ? ('igo.geo.mapButtons.resetRotation' | translate): ('igo.geo.mapButtons.tipRotation' | translate)"
+  matTooltipPosition="left">
+  <button mat-icon-button matTooltipPosition="left" [color]="color" [disabled]="!rotated"
+    (click)="map.viewController.resetRotation()">
+    <mat-icon [ngStyle]="rotationStyle(map.viewController.getRotation())" svgIcon="navigation">
+    </mat-icon>
+  </button>
+</div>
+
+<div *ngIf="showIfNoRotation" class="igo-rotation-button-container"
+  [matTooltip]="rotated ? ('igo.geo.mapButtons.resetRotation' | translate): ('igo.geo.mapButtons.tipRotation' | translate)"
+  matTooltipPosition="left">
+  <button mat-icon-button matTooltipPosition="left" [color]="color" [disabled]="!rotated"
     (click)="map.viewController.resetRotation()">
     <mat-icon [ngStyle]="rotationStyle(map.viewController.getRotation())" svgIcon="navigation">
     </mat-icon>
diff --git a/packages/geo/src/lib/map/rotation-button/rotation-button.component.scss b/packages/geo/src/lib/map/rotation-button/rotation-button.component.scss
index 962260ea58..206f2a264c 100644
--- a/packages/geo/src/lib/map/rotation-button/rotation-button.component.scss
+++ b/packages/geo/src/lib/map/rotation-button/rotation-button.component.scss
@@ -1,3 +1,4 @@
+@import '../../../../../core/src/style/partial/media';
 @import '../../../../../core/src/style/partial/core.variables';
 
 .igo-rotation-button-container {
@@ -11,4 +12,9 @@
 button,
 :host >>> button .mat-button-ripple-round {
   border-radius: 0;
+  &:disabled {
+    @include mobile {
+      display: none;
+    }
+  }
 }
diff --git a/packages/geo/src/lib/map/rotation-button/rotation-button.component.ts b/packages/geo/src/lib/map/rotation-button/rotation-button.component.ts
index cdfe91092c..2a3773ca7c 100644
--- a/packages/geo/src/lib/map/rotation-button/rotation-button.component.ts
+++ b/packages/geo/src/lib/map/rotation-button/rotation-button.component.ts
@@ -17,6 +17,15 @@ export class RotationButtonComponent {
   }
   private _map: IgoMap;
 
+  @Input()
+  get showIfNoRotation(): boolean {
+    return this._showIfNoRotation;
+  }
+  set showIfNoRotation(value: boolean) {
+    this._showIfNoRotation = value;
+  }
+  private _showIfNoRotation: boolean;
+
   @Input()
   get color(): string {
     return this._color;
@@ -26,6 +35,10 @@ export class RotationButtonComponent {
   }
   private _color: string;
 
+  get rotated(): boolean {
+    return this.map.viewController.getRotation() !== 0;
+  }
+
   constructor() {}
 
   rotationStyle(radians): {} {
diff --git a/packages/geo/src/lib/map/shared/controllers/view.ts b/packages/geo/src/lib/map/shared/controllers/view.ts
index 4c5132cdda..479a8e6b96 100644
--- a/packages/geo/src/lib/map/shared/controllers/view.ts
+++ b/packages/geo/src/lib/map/shared/controllers/view.ts
@@ -225,7 +225,7 @@ export class MapViewController extends MapController {
    * Reset the view rotation to 0
    */
   resetRotation() {
-    this.olView.setRotation(0);
+    this.olView.animate({rotation: 0});
   }
 
   /**
diff --git a/packages/geo/src/locale/en.geo.json b/packages/geo/src/locale/en.geo.json
index 7536f9a4dd..e42e86a8d2 100644
--- a/packages/geo/src/locale/en.geo.json
+++ b/packages/geo/src/locale/en.geo.json
@@ -121,7 +121,8 @@
         "geolocate": "Geolocate",
         "zoomIn": "Zoom in ({{zoom}})",
         "zoomOut": "Zoom out ({{zoom}})",
-        "resetRotation": "Set map to north"
+        "resetRotation": "Set map to north",
+        "tipRotation": "Hold Alt and SHIFT while dragging on map to rotate the map."
       },
       "metadata": {
         "show": "Show metadata"
diff --git a/packages/geo/src/locale/fr.geo.json b/packages/geo/src/locale/fr.geo.json
index c1ac3a0f2e..94fe6b161e 100644
--- a/packages/geo/src/locale/fr.geo.json
+++ b/packages/geo/src/locale/fr.geo.json
@@ -121,7 +121,8 @@
         "geolocate": "Positionnement GPS",
         "zoomIn": "Zoomer ({{zoom}})",
         "zoomOut": "Dézoomer ({{zoom}})",
-        "resetRotation": "Réinitialiser la carte vers le nord"
+        "resetRotation": "Réinitialiser la carte vers le nord",
+        "tipRotation": "Maintenez les touches Alt et Majuscule (shift) tout en cliquant sur la carte pour faire pivoter la carte"
       },
       "metadata": {
         "show": "Montrer les métadonnées"