x
Updates
askbox open!
the great ace attorney chronicles, persona 5 royal
this is how you lose the time war
the good place, the umbrella academy
you can customise the text and icons here!
Terms of Use

Thank you for installing xuethms' Hydrogen theme. By installing this theme, you agree to the following terms of use:

  • Do not edit and/or remove the visual and in-code credits.
  • Do not reupload my codes and designs on tumblr or other platforms.
  • Do not use my codes on platforms other than tumblr without permission.
  • Do not steal any portion of my codes for personal/commercial use.

I would appreciate it a lot if you can help to like and reblog my theme post, or even to leave a small tip at my ko-fi. If you run into any issues, drop me a message and I'll get back to you as soon as possible!

You can access this theme's customisation guide to learn more about the features and options available.

To agree to my terms of use and to remove this pop-up, please scroll down to the Terms of use selection option (below all the theme colour options) and select agree to terms. Quick video tutorial here.
Invalid Post Column & Sizes Combination

The combinatino of options you've selected for Post Columns and Post Size is not supported, as the total content width is likely to exceed most users' screen sizes. Please choose one of these combinations instead:

  • One column + 700px / 500px / 400px / 250px
  • Two columns + 250px
Please change to a lower number of columns, or to a smaller post size.
xue
index
message
past
“
against a dark sky, all flowers look like fireworks.
x
hydrogen
Hydrogen by xuethms features strong accent colours and grids.
features links updates codes install
_
Theme Features.txtNewDocument_0.txt
Theme Features

Hydrogen is a windows-inspired theme that features a strong accent colour along with grid patterns and flashy elements.

Tutorials

This page provides an overview of all customisation options. For step-by-step help on how to customise specific elements of the theme, please see the tutorials below:

Features

OVERALL

  • Choose a main accent colour that is seen throughout the theme.
  • “Windowed” elements for most items in the theme.
  • Customised scrollbar, text highlight, hover tooltips. You can edit the bold, italic, and linked text formatting.
  • Beautiful cappuccicons from suiomi.
  • Hidden tumblr controls.
  • Two default font sizes: 12px and 14px.
  • Updates section to list your media and status (below tumblr controls). Up to 5 items; select an icon (or choose your own one by following this tutorial) and type a quick update next to each one.

SIDEBAR

  • Sidebar image with decorative elements (grid pattern, sparkle shapes, “washi tape”).
  • Two navigation styles: Icons or text links.
  • Floating sidebar quote. Adjustable vertical position and the quotation marks can be hidden.
  • Unlimited built-in custom links. Grid background can be toggled off if it’s too distracting.

POSTS & CONTENT

  • Post layouts available: 1 column with 250/400/500/700px, or 2 columns with 250px posts only.
  • Pinned post label.
  • Visible tags on index. Options available to hide on index and to truncate them.
  • Every post type is uniquely styled. Media such as asks, audio, and links are styled using the “Post embed background” and “Post embed border” colour options.
  • Different styles for the note count icon.
  • Different permalink date formats available. E.g, 14JUL vs 14 July vs Monday vs 14.07.24.
  • NPF support!
  • Styled headers for tag pages.

Theme Options

IMAGE OPTIONS

  • Sidebar: Any size can be uploaded. Full image will be shown.
  • Favicon: The lil’ icon that goes into your browser tab. If you upload a custom favicon here, you need to toggle the “Custom Favicon” option below.

ON/OFF TOGGLES (Selected options in brackets)

  • Custom Favicon (off): Turn on if you want to upload your own custom favicon.
  • Show updates section (on): Shows an additional button below the tumblr controls. On click, a small window appears. Users can list media they are watching or post live updates in this window.
  • Truncate tags (on): If tags are shown on index, they will be cut off with ellipsis once they get too long (a little shorter than half the post size). This reduces tag text clutter on index.

SELECTION OPTIONS (selected options in this preview indicated by an asterisk*)

  • Tumblr controls colour: white / grey / black*
  • Main font: Consolas* / Karla / Nunito / Ubuntu / Poppins / Open Sans / Roboto
  • Main font size: 12px* / 14px
  • Post columns: one column* / two columns
  • Post size: 250px / 400px / 500px* / 700px
  • Sidebar image tape: show* / hide
  • Sidebar quotation mark display: show* / hide
  • Navigation type: icons* / text
  • Sidebar links style: grid bg* / no bg
  • Photoset grid gap: 3px* / 0px / 5px
  • Photo lightbox: light* / dark
  • Numbered list style: i, ii, iii* / 1, 2, 3 / a, b, c / あ, い, う
  • Note count icon: activity* / heart / bookmark / box / feather / folder
  • Permalink date format: 22JUL* / 22 July / MONDAY / 22.07.24
  • Show tags on index: show* / hide
  • Updates item X icon name: stars / envelope / book / bookmark / gaming-controller / tv / movie / feather / warning / pin

TEXT OPTIONS

  • Browser tab title: The name of the browser tab.
  • Sidebar quote: Appears to the left of the sidebar.
  • Sidebar quote vertical position: You can change the spacing between the quote and the bottom of the sidebar image.
  • Updates section title: Change the title of the little window.
  • Updates item X text: Your updates here. Up to 5 items.

Credits