diff --git a/__tests__/src/components/GalleryView.test.js b/__tests__/src/components/GalleryView.test.js
index dfee35e03a582ea42a7dec907cf9da705814afc3..84a2c03b976bcb70edc3698c30af368f19ccfe1d 100644
--- a/__tests__/src/components/GalleryView.test.js
+++ b/__tests__/src/components/GalleryView.test.js
@@ -32,4 +32,16 @@ describe('GalleryView', () => {
   it('renders gallery items for all canvases', () => {
     expect(wrapper.find(GalleryViewThumbnail).length).toBe(3);
   });
+
+  describe('when viewingDirection="right-to-left"', () => {
+    beforeEach(() => {
+      wrapper = createWrapper({
+        viewingDirection: 'right-to-left',
+      });
+    });
+
+    it('sets up Paper to be rtl', () => {
+      expect(wrapper.find('WithStyles(ForwardRef(Paper))').props().dir).toEqual('rtl');
+    });
+  });
 });
diff --git a/src/components/GalleryView.js b/src/components/GalleryView.js
index 25d940b975da70bfb91735f969c9d652a4a41151..3cd865608fbaf4983939e720b51b6704fa0620a7 100644
--- a/src/components/GalleryView.js
+++ b/src/components/GalleryView.js
@@ -12,11 +12,13 @@ export class GalleryView extends Component {
    */
   render() {
     const {
-      canvases, classes, windowId,
+      canvases, classes, viewingDirection, windowId,
     } = this.props;
+    const htmlDir = viewingDirection === 'right-to-left' ? 'rtl' : 'ltr';
     return (
       <Paper
         component="section"
+        dir={htmlDir}
         square
         elevation={0}
         className={classes.galleryContainer}
@@ -39,9 +41,11 @@ export class GalleryView extends Component {
 GalleryView.propTypes = {
   canvases: PropTypes.array.isRequired, // eslint-disable-line react/forbid-prop-types
   classes: PropTypes.objectOf(PropTypes.string),
+  viewingDirection: PropTypes.string,
   windowId: PropTypes.string.isRequired,
 };
 
 GalleryView.defaultProps = {
   classes: {},
+  viewingDirection: '',
 };
diff --git a/src/containers/GalleryView.js b/src/containers/GalleryView.js
index 68d0a83aa356f9e1a7ba1708f01a2db860c9c219..4f7995c68446c7db1b760ae6d91efd68b147a480 100644
--- a/src/containers/GalleryView.js
+++ b/src/containers/GalleryView.js
@@ -3,7 +3,7 @@ import { connect } from 'react-redux';
 import { withStyles } from '@material-ui/core/styles';
 import { withPlugins } from '../extend/withPlugins';
 import { GalleryView } from '../components/GalleryView';
-import { getManifestCanvases } from '../state/selectors';
+import { getManifestCanvases, getManifestViewingDirection } from '../state/selectors';
 
 /**
  * mapStateToProps - to hook up connect
@@ -13,6 +13,7 @@ import { getManifestCanvases } from '../state/selectors';
 const mapStateToProps = (state, { windowId }) => (
   {
     canvases: getManifestCanvases(state, { windowId }),
+    viewingDirection: getManifestViewingDirection(state, { windowId }),
   }
 );