#Code Guide

This is a list of pre-made layouts and code snippets that are free for you to use. Check individual posts for details on how to use them. There’s also a Github repository listing them here. A few notes:

  • All themes are licensed under the MIT License, which means they’re free for you to use however you want. The only stipulation is that you retain attribution to me, which can be as simple as leaving credit in the HTML/CSS comments (hidden from public view.)
  • Page themes are platform agnostic layouts and can be used anywhere that supports (modern) HTML/CSS. They use CSS variables to manage user settings so you can swap out colors, images, fonts, etc. These variables are located in the :root element. If you’d like to know more about CSS variables, you can read this guide.
  • Page themes are meant to look identical to previews out-of-the-box, so they come shipped with web URL images rather than local links. I encourage you to link your content locally.
  • Page themes are stored in one messy file so you can easily drop it in and test it out, but this is not best practice. If you plan to use any themes across multiple pages, I strongly recommend separating the CSS and JS into their own files.
  • Themes are tested on Mozilla and Chrome on a variety of displays, but there’s no way I’ll catch all bugs. If anything is weird, let me know.
  • For instructions on installing a Tumblr theme, you can read their official documentation.

Feel free to email me (nenrikido@pm.me) with any questions/comments or leave a comment here.

Comment Form is loading comments...

A Tumblr theme preview. It has a pastel rainbow background with a Creamy Mami character as the sidebar icon. The theme switches through different color themes based on the flag stripe that is selected. Alternate Tumblr theme preview.

Rainbow Tumblr Theme

live preview

Finally converted the Rainbow Page Theme to a Tumblr theme. Happy pride!

Features:

  • 500px posts
  • Pride flag theme toggler
  • Optional jukebox/badges boxes
  • Custom audio player for posts
  • Customizable title + title font size
  • Support for additional pages
  • User can add a link to any song for jukebox
  • Optional link 4 + 5
  • Optional background image or color
  • Semi-transparent posts
  • Custom permalink icon + favicon

Rainbow Page Theme

live preview / tumblr post

made a theme for pride month based on the original 70s rainbow flag! you can click on stripes of the flag to swap color schemes.

features:

  • customizable background & sidebar images
  • pride flag theme toggler (uses javascript)
  • animated rainbow title
  • lightly styled audio player
  • responsive image class
  • …and other cool stuff!

Sakura Page Theme

live preview / tumblr post

re-coded an unreleased page theme an anon asked me to release like 5 years ago (example of the original). realized i actually hated a lot of how it was originally handled and now…it is ready to be unfurled!

features:

  • 2 custom pixels that trigger pop-up boxes/modals
  • customizable fonts, images, and colors
  • title font supports english & japanese
  • header designed for 4:3 ratio gifs/images
  • mobile responsive (built with flexbox)

Sunflower Page Theme

live preview / tumblr post

completely re-coded and re-vamped a page theme from 2018 i made for tumblr. (original is here.) added a few features, made it behave on mobile, and it is now published for use anywhere.

features:

  • up to 2 side images (left & right)
  • customizable fonts, font sizes, images, and colors
  • mobile responsive (built with flexbox)
  • …and more!

A gif of a loading screen as the home page for Nenrikido loads.

Preloader

blog post + codepen

“I recently decided it might improve user experience to get a loading screen instead of watching the grid unceremoniously disentangle itself. A few experiments later, and here we are.”

A theme preview. It's pink and minimal. A blue theme with a cat icon on the sidebar.

Toothache Theme

live preview / tumblr post

this is a re-release of my very first theme back in 2016…it’s cleaned up & a bit more comprehensible.

features:

  • 400px posts
  • 2 links w/ a customizable link divider
  • customizable post background color, permalink, favicon
  • dropdown font selection & customizable font size
  • options for rounded/square sidebar image
  • option to show/not show your description

A yellow Tumblr blog theme. It's minimal and serene with a photo of flowers and a sleeping girl. An alternate pink version of the theme that is left aligned rather than centered.

Pudding Theme

live preview / tumblr post

i love the plain times theme and have made lots of customizations over the years. so i decided to finally tidy it up and release it as a formal edit.

features:

  • 500px posts
  • left or center aligned posts
  • links for ask & archive (if enabled)
  • customizable fonts (dropdown selection)
  • custom permalink icon or text
  • optional title, header image, & blockquote indentation