diff --git a/guides/assets/images/rails_guides_logo_1x.png b/guides/assets/images/rails_guides_logo_1x.png
new file mode 100644
index 0000000000..8c6810c312
Binary files /dev/null and b/guides/assets/images/rails_guides_logo_1x.png differ
diff --git a/guides/assets/images/rails_guides_logo_2x.png b/guides/assets/images/rails_guides_logo_2x.png
new file mode 100644
index 0000000000..accc6bbfa4
Binary files /dev/null and b/guides/assets/images/rails_guides_logo_2x.png differ
diff --git a/guides/assets/stylesheets/main.css b/guides/assets/stylesheets/main.css
index d6897aae03..bdc3e21977 100644
--- a/guides/assets/stylesheets/main.css
+++ b/guides/assets/stylesheets/main.css
@@ -538,13 +538,26 @@ h6 {
 
 #header h1 {
   float: left;
-  background: url(../images/rails_guides_logo.gif) no-repeat;
+  background: url(../images/rails_guides_logo_1x.png) no-repeat;
   width: 297px;
   text-indent: -9999em;
   margin: 0;
   padding: 0;
 }
 
+@media
+only screen and (-webkit-min-device-pixel-ratio: 2),
+only screen and (   min--moz-device-pixel-ratio: 2),
+only screen and (     -o-min-device-pixel-ratio: 2/1),
+only screen and (        min-device-pixel-ratio: 2),
+only screen and (                min-resolution: 192dpi),
+only screen and (                min-resolution: 2dppx) {
+  #header h1 {
+    background: url(../images/rails_guides_logo_2x.png) no-repeat;
+    background-size: 160%;
+  }
+}
+
 @media screen and (max-width: 480px) {
   #header h1 {
     float: none;