diff --git a/src/components/library/library.jsx b/src/components/library/library.jsx
index 41ed6dffcc7c70bbf0ea3b66cad9ab358d78ccfb..0a3e3b5252a5378580368d39d14e1dac41da5924 100644
--- a/src/components/library/library.jsx
+++ b/src/components/library/library.jsx
@@ -34,7 +34,8 @@ class LibraryComponent extends React.Component {
             'handleMouseEnter',
             'handleMouseLeave',
             'handleSelect',
-            'handleTagClick'
+            'handleTagClick',
+            'setFilteredDataRef'
         ]);
         this.state = {
             selectedItem: null,
@@ -57,6 +58,7 @@ class LibraryComponent extends React.Component {
             filterQuery: '',
             selectedTag: tag.toLowerCase()
         });
+        this.scrollToTop();
     }
     handleMouseEnter (id) {
         if (this.props.onItemMouseEnter) this.props.onItemMouseEnter(this.getFilteredData()[id]);
@@ -69,6 +71,7 @@ class LibraryComponent extends React.Component {
             filterQuery: event.target.value,
             selectedTag: ALL_TAG_TITLE.toLowerCase()
         });
+        this.scrollToTop();
     }
     handleFilterClear () {
         this.setState({filterQuery: ''});
@@ -92,6 +95,12 @@ class LibraryComponent extends React.Component {
                 .indexOf(this.state.selectedTag) !== -1
         ));
     }
+    scrollToTop () {
+        this.filteredDataRef.scrollTop = 0;
+    }
+    setFilteredDataRef (ref) {
+        this.filteredDataRef = ref;
+    }
     render () {
         return (
             <Modal
@@ -141,6 +150,7 @@ class LibraryComponent extends React.Component {
                     className={classNames(styles.libraryScrollGrid, {
                         [styles.withFilterBar]: this.props.filterable || this.props.tags
                     })}
+                    ref={this.setFilteredDataRef}
                 >
                     {this.getFilteredData().map((dataItem, index) => {
                         const scratchURL = dataItem.md5 ?