diff --git a/src/routes/Library/Library.js b/src/routes/Library/Library.js
index 2871a9b3f..e1cea5995 100644
--- a/src/routes/Library/Library.js
+++ b/src/routes/Library/Library.js
@@ -5,7 +5,8 @@ const PropTypes = require('prop-types');
 const classnames = require('classnames');
 const NotFound = require('stremio/routes/NotFound');
 const { useProfile, useNotifications, routesRegexp, useOnScrollToBottom, withCoreSuspender } = require('stremio/common');
-const { Button, DelayedRenderer, Chips, Image, MainNavBars, Multiselect, LibItem } = require('stremio/components');
+const { DelayedRenderer, Chips, Image, MainNavBars, Multiselect, LibItem } = require('stremio/components');
+const { default: Placeholder } = require('./Placeholder');
 const useLibrary = require('./useLibrary');
 const useSelectableInputs = require('./useSelectableInputs');
 const styles = require('./styles');
@@ -76,17 +77,7 @@ const Library = ({ model, urlParams, queryParams }) => {
                 }
                 {
                     model === 'library' && profile.auth === null ?
-                        <div className={classnames(styles['message-container'], styles['no-user-message-container'])}>
-                            <Image
-                                className={styles['image']}
-                                src={require('/images/anonymous.png')}
-                                alt={' '}
-                            />
-                            <div className={styles['message-label']}>Library is only available for logged in users!</div>
-                            <Button className={styles['login-button-container']} href={'#/intro'}>
-                                <div className={styles['label']}>LOG IN</div>
-                            </Button>
-                        </div>
+                        <Placeholder />
                         :
                         library.selected === null ?
                             <DelayedRenderer delay={500}>
diff --git a/src/routes/Library/styles.less b/src/routes/Library/styles.less
index 2bdbc13ec..76a16940e 100644
--- a/src/routes/Library/styles.less
+++ b/src/routes/Library/styles.less
@@ -66,38 +66,6 @@
                 padding: 4rem;
             }
 
-            &.no-user-message-container {
-                .login-button-container {
-                    flex: none;
-                    display: flex;
-                    flex-direction: row;
-                    align-items: center;
-                    justify-content: center;
-                    width: 20rem;
-                    height: 3.5rem;
-                    border-radius: 3.5rem;
-                    padding: 0.5rem 1rem;
-                    margin-bottom: 1rem;
-                    background-color: var(--secondary-accent-color);
-
-                    &:hover {
-                        outline: var(--focus-outline-size) solid var(--secondary-accent-color);
-                        background-color: transparent;
-                    }
-
-                    .label {
-                        flex-grow: 0;
-                        flex-shrink: 1;
-                        flex-basis: auto;
-                        max-height: 4.8em;
-                        font-size: 1.2rem;
-                        font-weight: 700;
-                        color: var(--primary-foreground-color);
-                        text-align: center;
-                    }
-                }
-            }
-
             .image {
                 flex: none;
                 width: 12rem;