diff --git a/examples/reprojection.html b/examples/reprojection.html
new file mode 100644
index 0000000000..52ddf0d862
--- /dev/null
+++ b/examples/reprojection.html
@@ -0,0 +1,49 @@
+---
+template: example.html
+title: Raster reprojection example
+shortdesc: Demonstrates client-side raster reprojection between various projections.
+docs: >
+  This example shows client-side raster reprojection capabilities of
+  OpenLayers 3 between various projections.
+tags: "reprojection, projection, proj4js, mapquest, wms"
+resources:
+  - http://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.6/proj4.js
+---
+<div class="row-fluid">
+  <div class="span12">
+    <div id="map" class="map"></div>
+  </div>
+  <form class="form-inline">
+    <div class="col-md-3">
+      <label>Base map:</label>
+      <select id="base-map">
+        <option value="MapQuest">MapQuest OSM</option>
+        <option value="wms4326">EPSG:4326 from WMS</option>
+      </select>
+    </div>
+    <div class="col-md-4">
+      <label>Overlay map:</label>
+      <select id="overlay-map">
+        <option value="OS">British National Grid (EPSG:27700)</option>
+        <option value="wms21781">Swisstopo WMS (EPSG:21781)</option>
+        <option value="wmts3413">NASA Arctic WMTS (EPSG:3413)</option>
+        <option value="grandcanyon">Grand Canyon HiDPI (EPSG:3857)</option>
+        <option value="states">United States (EPSG:3857)</option>
+      </select>
+    </div>
+    <div class="col-md-5">
+      <label>View projection:</label>
+      <select id="view-projection">
+        <option value="EPSG:3857">Spherical Mercator (EPSG:3857)</option>
+        <option value="EPSG:4326">EPSG:4326</option>
+        <option value="ESRI:54009">Mollweide (ESRI:54009)</option>
+        <option value="EPSG:27700">British National Grid (EPSG:27700)</option>
+        <option value="EPSG:23032">ED50 / UTM zone 32N (EPSG:23032)</option>
+        <option value="EPSG:2163">US National Atlas Equal Area (EPSG:2163)</option>
+        <option value="EPSG:3413">NSIDC Polar Stereographic North (EPSG:3413)</option>
+        <option value="EPSG:5479">RSRGD2000 / MSLC2000 (EPSG:5479)</option>
+      </select>
+    </div>
+    <label for="render-edges"><input type="checkbox" id="render-edges" />Render reprojection edges</label>
+  </form>
+</div>
diff --git a/examples/reprojection.js b/examples/reprojection.js
new file mode 100644
index 0000000000..fb0cf70d09
--- /dev/null
+++ b/examples/reprojection.js
@@ -0,0 +1,238 @@
+goog.require('ol.Attribution');
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.extent');
+goog.require('ol.format.WMTSCapabilities');
+goog.require('ol.layer.Tile');
+goog.require('ol.proj');
+goog.require('ol.source.MapQuest');
+goog.require('ol.source.TileImage');
+goog.require('ol.source.TileWMS');
+goog.require('ol.source.WMTS');
+goog.require('ol.source.XYZ');
+goog.require('ol.tilegrid.TileGrid');
+
+
+proj4.defs('EPSG:27700', '+proj=tmerc +lat_0=49 +lon_0=-2 +k=0.9996012717 ' +
+    '+x_0=400000 +y_0=-100000 +ellps=airy ' +
+    '+towgs84=446.448,-125.157,542.06,0.15,0.247,0.842,-20.489 ' +
+    '+units=m +no_defs');
+var proj27700 = ol.proj.get('EPSG:27700');
+proj27700.setExtent([0, 0, 700000, 1300000]);
+
+proj4.defs('EPSG:23032', '+proj=utm +zone=32 +ellps=intl ' +
+    '+towgs84=-87,-98,-121,0,0,0,0 +units=m +no_defs');
+var proj23032 = ol.proj.get('EPSG:23032');
+proj23032.setExtent([-1206118.71, 4021309.92, 1295389.00, 8051813.28]);
+
+proj4.defs('EPSG:5479', '+proj=lcc +lat_1=-76.66666666666667 +lat_2=' +
+    '-79.33333333333333 +lat_0=-78 +lon_0=163 +x_0=7000000 +y_0=5000000 ' +
+    '+ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs');
+var proj5479 = ol.proj.get('EPSG:5479');
+proj5479.setExtent([6825737.53, 4189159.80, 9633741.96, 5782472.71]);
+
+proj4.defs('EPSG:5041', '+proj=stere +lat_0=90 +lat_ts=90 +lon_0=0 +k=0.994 ' +
+    '+x_0=2000000 +y_0=2000000 +datum=WGS84 +units=m +no_defs');
+var proj5041 = ol.proj.get('EPSG:5041');
+proj5041.setExtent([1994055.62, 5405875.53, 2000969.46, 2555456.55]);
+
+proj4.defs('EPSG:21781', '+proj=somerc +lat_0=46.95240555555556 ' +
+    '+lon_0=7.439583333333333 +k_0=1 +x_0=600000 +y_0=200000 +ellps=bessel ' +
+    '+towgs84=674.4,15.1,405.3,0,0,0,0 +units=m +no_defs');
+var proj21781 = ol.proj.get('EPSG:21781');
+proj21781.setExtent([485071.54, 75346.36, 828515.78, 299941.84]);
+
+proj4.defs('EPSG:3413', '+proj=stere +lat_0=90 +lat_ts=70 +lon_0=-45 +k=1 ' +
+    '+x_0=0 +y_0=0 +datum=WGS84 +units=m +no_defs');
+var proj3413 = ol.proj.get('EPSG:3413');
+proj3413.setExtent([-4194304, -4194304, 4194304, 4194304]);
+
+proj4.defs('EPSG:2163', '+proj=laea +lat_0=45 +lon_0=-100 +x_0=0 +y_0=0 ' +
+    '+a=6370997 +b=6370997 +units=m +no_defs');
+var proj2163 = ol.proj.get('EPSG:2163');
+proj2163.setExtent([-8040784.5135, -2577524.9210, 3668901.4484, 4785105.1096]);
+
+proj4.defs('ESRI:54009', '+proj=moll +lon_0=0 +x_0=0 +y_0=0 +datum=WGS84 ' +
+    '+units=m +no_defs');
+var proj54009 = ol.proj.get('ESRI:54009');
+proj54009.setExtent([-18e6, -9e6, 18e6, 9e6]);
+
+
+var layers = [];
+
+layers['OS'] = new ol.layer.Tile({
+  source: new ol.source.XYZ({
+    projection: 'EPSG:27700',
+    url: 'https://googledrive.com/host/0B0bm2WdRuvICflNqUmxEdUNOV0ZRUFQ3cXNXR' +
+        'FlOTm9MWmJxSDAxM2V5M1ZJX2lITE9oejA/{z}/{x}/{y}.png',
+    maxZoom: 3
+  })
+});
+
+layers['MapQuest'] = new ol.layer.Tile({
+  source: new ol.source.MapQuest({layer: 'osm'})
+});
+
+layers['wms4326'] = new ol.layer.Tile({
+  source: new ol.source.TileWMS({
+    url: 'http://demo.boundlessgeo.com/geoserver/wms',
+    params: {
+      'LAYERS': 'ne:NE1_HR_LC_SR_W_DR'
+    },
+    projection: 'EPSG:4326'
+  })
+});
+
+layers['wms21781'] = new ol.layer.Tile({
+  source: new ol.source.TileWMS({
+    attributions: [new ol.Attribution({
+      html: '&copy; ' +
+          '<a href="http://www.geo.admin.ch/internet/geoportal/' +
+          'en/home.html">' +
+          'Pixelmap 1:1000000 / geo.admin.ch</a>'
+    })],
+    crossOrigin: 'anonymous',
+    params: {
+      'LAYERS': 'ch.swisstopo.pixelkarte-farbe-pk1000.noscale',
+      'FORMAT': 'image/jpeg'
+    },
+    url: 'http://wms.geo.admin.ch/',
+    projection: 'EPSG:21781'
+  })
+});
+
+var parser = new ol.format.WMTSCapabilities();
+$.ajax('http://map1.vis.earthdata.nasa.gov/wmts-arctic/' +
+    'wmts.cgi?SERVICE=WMTS&request=GetCapabilities').then(function(response) {
+  var result = parser.read(response);
+  var options = ol.source.WMTS.optionsFromCapabilities(result,
+      {layer: 'OSM_Land_Mask', matrixSet: 'EPSG3413_250m'});
+  options.projection = 'EPSG:3413';
+  options.wrapX = false;
+  layers['wmts3413'] = new ol.layer.Tile({
+    source: new ol.source.WMTS(options)
+  });
+});
+
+layers['grandcanyon'] = new ol.layer.Tile({
+  source: new ol.source.XYZ({
+    url: 'http://tileserver.maptiler.com/grandcanyon@2x/{z}/{x}/{y}.png',
+    tilePixelRatio: 2,
+    maxZoom: 15,
+    attributions: [new ol.Attribution({
+      html: 'Tiles &copy; USGS, rendered with ' +
+          '<a href="http://www.maptiler.com/">MapTiler</a>'
+    })]
+  })
+});
+
+var startResolution =
+    ol.extent.getWidth(ol.proj.get('EPSG:3857').getExtent()) / 256;
+var resolutions = new Array(22);
+for (var i = 0, ii = resolutions.length; i < ii; ++i) {
+  resolutions[i] = startResolution / Math.pow(2, i);
+}
+
+layers['states'] = new ol.layer.Tile({
+  source: new ol.source.TileWMS({
+    url: 'http://demo.boundlessgeo.com/geoserver/wms',
+    params: {'LAYERS': 'topp:states', 'TILED': true},
+    serverType: 'geoserver',
+    tileGrid: new ol.tilegrid.TileGrid({
+      extent: [-13884991, 2870341, -7455066, 6338219],
+      resolutions: resolutions,
+      tileSize: [512, 256]
+    }),
+    projection: 'EPSG:3857'
+  })
+});
+
+
+var map = new ol.Map({
+  layers: [
+    layers['MapQuest'],
+    layers['OS']
+  ],
+  renderer: common.getRendererFromQueryString(),
+  target: 'map',
+  view: new ol.View({
+    projection: 'EPSG:3857',
+    center: [0, 0],
+    zoom: 2
+  })
+});
+
+
+var baseMapSelect = document.getElementById('base-map');
+var overlayMapSelect = document.getElementById('overlay-map');
+var viewProjSelect = document.getElementById('view-projection');
+var renderEdgesCheckbox = document.getElementById('render-edges');
+var renderEdges = false;
+
+function updateViewProjection() {
+  var newProj = ol.proj.get(viewProjSelect.value);
+  var newProjExtent = newProj.getExtent();
+  var newView = new ol.View({
+    projection: newProj,
+    center: ol.extent.getCenter(newProjExtent || [0, 0, 0, 0]),
+    zoom: 0,
+    extent: newProjExtent || undefined
+  });
+  map.setView(newView);
+}
+
+
+/**
+ * @param {Event} e Change event.
+ */
+viewProjSelect.onchange = function(e) {
+  updateViewProjection();
+};
+
+updateViewProjection();
+
+var updateRenderEdgesOnLayer = function(layer) {
+  if (layer instanceof ol.layer.Tile) {
+    var source = layer.getSource();
+    if (source instanceof ol.source.TileImage) {
+      source.setRenderReprojectionEdges(renderEdges);
+    }
+  }
+};
+
+
+/**
+ * @param {Event} e Change event.
+ */
+baseMapSelect.onchange = function(e) {
+  var layer = layers[baseMapSelect.value];
+  if (layer) {
+    layer.setOpacity(1);
+    updateRenderEdgesOnLayer(layer);
+    map.getLayers().setAt(0, layer);
+  }
+};
+
+
+/**
+ * @param {Event} e Change event.
+ */
+overlayMapSelect.onchange = function(e) {
+  var layer = layers[overlayMapSelect.value];
+  if (layer) {
+    layer.setOpacity(0.7);
+    updateRenderEdgesOnLayer(layer);
+    map.getLayers().setAt(1, layer);
+  }
+};
+
+
+/**
+ * @param {Event} e Change event.
+ */
+renderEdgesCheckbox.onchange = function(e) {
+  renderEdges = renderEdgesCheckbox.checked;
+  map.getLayers().forEach(function(layer) {
+    updateRenderEdgesOnLayer(layer);
+  });
+};