You are browsing as a guest. Sign up (or log in) to start making projects!

starTab

  • 3 Devlogs
  • 4 Total hours

a new tab page that shows a different piece of the actual universe every day, tells time, gives you the weather, and remembers your shortcuts.

Ship #1

Built startab, a custom new-tab dashboard that replaces your browser’s default tab with NASA’s Astronomy Picture of the Day as a full-screen background (supporting both images and videos, including YouTube/Vimeo embeds), a live clock, a geolocation-based weather widget with forecast, and a localStorage-backed shortcuts grid, all wrapped in a custom glassmorphism UI built from scratch. The trickiest part was keeping text readable against a background that changes every day, which I solved with a canvas-based brightness sampler that flips text between white and black depending on the image, plus switching several UI elements from a single global scroll threshold to per-element getBoundingClientRect() checks so each one reacts to its own position on screen. I’m most proud of how that adaptive theming ties everything together – the clock, weather widget, and buttons all smoothly shift color based on what’s behind them, which makes it feel a lot more polished than just a static background with white text slapped on. To test it: allow geolocation for local weather (denying it just falls back to a default city), right-click a shortcut to delete it or click “+” to add one, and check back on different days since APOD is sometimes a video instead of a photo.

Try project → See source code →
Open comments for this post

1h 28m 49s logged

starTab devlog 3

we are finished!

what was added?

  • animations for modals
  • coloring of text based on background
  • more info button now stays at the button
  • video support
  • searching via the input works (enter to search)

i like it a lot somehow

0
0
3
Open comments for this post

47m 11s logged

startab devlog 2

im really having fun with this project.

whats new tho?

  • shortcuts: they save to localstorage and you can add them by clicking the button or remove by right clicking one
  • little snackbar notifications for stuff like incorrect input
  • blur efffects

very cool!

0
0
3
Open comments for this post

1h 33m 38s logged

starTab devlog 1

i totally forgot to post prior devlogs and just worked lol

whats there?

  • shortcuts! you can add and delete shortcuts from the new tab page
  • search bar! currently nonfunctional
  • clock and date! selfexplanatory

what will there be?

  • more info about image! could be interesting
  • custom dialogs for stuff like adding a tab
  • and moreeee
0
0
3

Delete project?

Are you sure you want to permanently delete this project? This action cannot be undone.

All devlogs, followers, and associated data will be removed.

Followers

Loading…