CODE: Retro Nav

[baisemain]

UPDATED 09/22/2025: Cursed discovery that drop-shadow filters display inconsistently on iOS. Don't know how to fix it yet, sorry.

I've been working on a retro pixel style journal layout, but it was turning into a Whole Project, so here's a cute little nav instead. This time I added a bunch of premade themes—please let me know what you think!

The code generator allows you to preview with your own content and links, and make adjustments to colours and layout. Click the "Show HTML" button to get your code.

RETRO NAV CODE GENERATOR

Title Text

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis suscipit pulvinar convallis. In hac habitasse platea dictumst. Praesent nisi enim, bibendum eget dui tincidunt, vehicula commodo velit. Fusce facilisis suscipit quam non luctus. In tortor ligula, ultricies sed augue et, consectetur lobortis tellus. Sed id malesuada lectus. Suspendisse sem lectus, vestibulum ut placerat at, dapibus at tortor. Vivamus finibus tincidunt massa ac mollis. Fusce euismod odio sed elit tincidunt, nec euismod odio accumsan. Vivamus felis magna, euismod id justo eu, tincidunt varius turpis.

Link One Link Two Link Three Link Four

code

Title Text

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis suscipit pulvinar convallis. In hac habitasse platea dictumst. Praesent nisi enim, bibendum eget dui tincidunt, vehicula commodo velit. Fusce facilisis suscipit quam non luctus.

In tortor ligula, ultricies sed augue et, consectetur lobortis tellus. Sed id malesuada lectus. Suspendisse sem lectus, vestibulum ut placerat at, dapibus at tortor. Vivamus finibus tincidunt massa ac mollis.

Link One Link Two Link Three Link Four

code

Title Text

I used <center> tags here.

Link One Link Two Link Three Link Four Link Five Link Six Link Seven Link Eight Link Nine

code

cute cat app

Here's an example without the link buttons. You can also easily remove the image if you want. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis suscipit pulvinar convallis. In hac habitasse platea dictumst. Praesent nisi enim, bibendum eget dui tincidunt, vehicula commodo velit. Fusce facilisis suscipit quam non luctus. In tortor ligula, ultricies sed augue et, consectetur lobortis tellus. Sed id malesuada lectus. Suspendisse sem lectus, vestibulum ut placerat at, dapibus at tortor.

code

I'm happy to provide help with using/editing my codes—just comment down below. And if you find my codes useful, please consider donating to my ko-fi! 💜

RETRO NAV CODE GENERATOR

Comments

[ceruledge]

oh this slaps

[thatjustwontbreak]

(Here by way of dwresources!)

So cool! I love the aesthetic of these. The premade themes are so helpful and I'm especially taken with Thistle.

[peasina]

This is so pretty! Does it only work on Neocities?

[baisemain]

The generator is hosted on Neocities, but the code was made to work on Dreamwidth. If you click the "Show HTML" button in the generator, you'll get something you can copy/paste into a journal entry.

[peasina]

Oh, I tried that and it didn't work. I'll keep trying! Thank you for making this :)

[baisemain]

Hmm, that's weird! If you're still having trouble, let me know what theme you want to use and I can give you the HTML directly. It should be easy enough to edit, it's just easier with the generator.

[nowhere]

love these! ❤

[10billionghosts]

YOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO
this is so aesthetically pleasing

Also the code generator is chef kiss

[baisemain]

omg thank you 🥹

it takes so long to make a generator but i HATE writing out the instructions lmao

[10billionghosts]

Genuinely writing actual instructions is like 200% worse than Just Coding lmao