✩‧₊˚౨ৎ˚₊✩‧Introduction!₊✩‧₊˚౨ৎ˚₊✩‧

Welcome to my Webpage! This is just a little personal project that I work on when I have writer's block. However, I'm happy other people get to enjoy this webpage also! Feel free to explore! I have some works that I love to share with the world, aswell as an about me page and some other pages that are still in the works! Also, before you leave, make sure to check out my credits section because a lot of great coders, webdesigners, and other resource makers made a lot of the things I put into this page. I'll provide links to each of the things that these people made!

This is a paragraph. As you can see, there's a bit of space between it and the previous paragraph.


And this is a divider! You can also add a cool glow to images using .image-glow

Some of the features of this template include:

  • A decorative border to add to images using .image-deco (and the glow mentioned above)
  • Outgoing links having an arrow attached to them
  • A marquee with an adjustable scroll speed (thanks to Salarua!)
  • A scrollable area you can place anywhere (and can change the size of by using inline CSS to just set it off the default 200px)
  • Colour variables + system-respecting dark mode colours
    • Also variables for changing the size of the sidebar + content! Currently it's at 250px for the sidebar and 700px for the main content
  • Pixel decorations for H1 and H2 which you can swap out using variables
  • Focus elements + skip to content
  • A mobile friendly layout + a mobile navigation with a dropdown toggle to hide/show the buttons
  • Helper classes like .hide-mobile and .hide-desktop to easily enable/disable mobile-specific and desktop-only things (if you're on mobile, you may see a box only meant for you!), and others like .center-item, .float-img-right, and .float-img-left (which on mobile will turn it to a non-floating item)

Some Javascript is included, though it's mostly for going back to the top of the site.


Surprise Box!

Hi! I'm a box you can only see on mobile, you will not see me on the desktop! Have a cookie. 🍪

Heading 2

Wow look it's a little mini gallery you can use to show whatever images you wanna show!!

These are multiple images in a row:

Here's a full width image!








Heading 3

You can do a bunch of cool stuff here!!

  • Unsorted list
  • Unsorted list
  • Unsorted list
    • And within a list!

Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

  1. Sorted list
  2. Sorted list
  3. Sorted list

Heading 4

Here are two columns:

Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr.

At vero eos et accusam et justo duo dolores et ea rebum.

Cool Update: words words words

Here's a cool area that can scroll as you write more in it; it's set to be at 200px by default but you can easily change that in the CSS or in the HTML directly!

You can use this to dedicate to your updates, or anything else like webrings and what not.


Heading 5
<div class="two-columns">
    <div>
        <p>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p>
        <p>At vero eos et accusam et justo duo dolores et ea rebum.</p>
    </div>
    <div>
        <p>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p>
        <p>At vero eos et accusam et justo duo dolores et ea rebum.</p>
    </div>
</div>
Heading 6

Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorp

One Hundred Sleepless Nights - Pierce the Veil