# Splash screen - no login

**URL:** <https://community.glideapps.com/t/splash-screen-no-login/81347>\
**Category:** Ask for Help\
**Created:** [April 15, 2025, 12:11am UTC](https://community.glideapps.com/t/splash-screen-no-login/81347 "2025-04-15T00:11:47Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Navigator](https://avatars.discourse-cdn.com/v4/letter/n/4af34b/32.png) [@Navigator](https://community.glideapps.com/u/Navigator)\
**Post date:** [April 15, 2025, 12:11am UTC](https://community.glideapps.com/t/splash-screen-no-login/81347/1 "2025-04-15T00:11:47Z")

</div>

My app will not have user login. Anyone can use the app.

How do I create a start-up splash screen?

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [April 15, 2025, 12:41am UTC](https://community.glideapps.com/t/splash-screen-no-login/81347/2 "2025-04-15T00:41:54Z")

</div>

Does the user have to click on something on the splash screen for them to access the main tab(s)?

---

<div class="post-metadata">

**Author:** ![Navigator](https://avatars.discourse-cdn.com/v4/letter/n/4af34b/32.png) [@Navigator](https://community.glideapps.com/u/Navigator)\
**Post date:** [April 15, 2025, 2:37pm UTC](https://community.glideapps.com/t/splash-screen-no-login/81347/3 "2025-04-15T14:37:59Z")

</div>

I would like it to work that way. Thank you!

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [April 16, 2025, 12:25am UTC](https://community.glideapps.com/t/splash-screen-no-login/81347/4 "2025-04-16T00:25:13Z")

</div>

I’m thinking if you have access to CSS, you can conditionally hide tabs even if your app is fully public.

- Add a “Splash” tab.
- Add a rich text component to it with the CSS class being “splash-tab”.
- In all other tabs, add a rich text component with the CSS class being “not-splash-tab”.
- Add this to your CSS in Settings \> Appearance.

```auto
#page-root:has(.splash-tab) div[class*="mobile-tab-bar"] {
display: none;
}

#page-root:has(.splash-tab) nav[class*="desktop-nav-bar"] {
display: none;
}

#page-root:has(.splash-tab) ul[class*="mobile-sidemenu___StyledUl"] {
visibility: hidden;
}

#page-root:has(.not-splash-tab) button[data-testid="tab-Splash"] {
display: none;
}

#page-root:has(.not-splash-tab) button[class*="desktop-nav-bar___StyledButton"]:nth-of-type(1) {
display: none;
}

```

Then, in your Splash tab, add a button for the user to navigate to another tab in your app.

The way this works is when the Splash tab is opened, CSS hides all other tabs. When you move to any other tab, the CSS hides the Splash tab.

Splash tab must be positioned first amongst your tabs, and named “Splash”.