Free CSS

Rules:

How to Use:

Dens and Branches:
  1. Copy the Code
  2. Paste it at the top of your territory/branch description before anything else (yes this is necessary)
  3. That's it! Your CSS should now be applied after saving your territory or branch description.
Caves:
  1. Copy the dropbox URL from the code
  2. Paste into the fields that says "Cave CSS/Mound CSS" above the text box for the cave description
  3. That's it! your layout should now be applied to your cave once you save the cave description.

"What URL are you talking about?" you may be asking. Let me give you an example so you can see more clearly what I mean.

<link rel="stylesheet" type="text/css" href="https://dl.dropbox.com/scl/fi/fug26ca908wzvgukmoump/charred-wood.css?rlkey=klh4xgro1la2u4rrqxecta373&st=gafkv3m1&dl=0" />

Here is the code for the Charred Wood layout. You'll see that in the href attribute there is double quotes surrounding the URL that I have highlighted in green. That highlighted section is exactly the URL I'm talking about. So to find the URL for any of the layouts, look for where it says href and copy whatever is inside the double quotes. Not including the double quotes themselves, just what's inside of them.

All of these layouts are clan compatible (applying works like dens and branches) and any whose names are in green have cave images included.

Aesthetic Layouts

Animal Layouts

Event Layouts

Pride Layouts

Scenic Layouts

Seasonal Layouts

Simple Layouts

Twitter-esque Layouts

Uncategorized Layouts

Den Box Add-ons

Disclaimer: These den boxes are subject to the same rules as my other free CSS, so anyone distributing them through free CSS or packaging them with their own commissions without my express permission will be reported for doing so. That is a gross breach of my rules. You can also only use one of these add-ons at a time as they will override each other.

How to Use:

  1. Copy the CSS Link (yes it is necessary to make the boxes work)
  2. Paste at the top of your territory description. It should be after any other CSS links you have (such as those for the layouts above) but before any text or box codes.
  3. Copy box HTML
  4. Paste into territory description after the CSS Link from previous steps
  5. Style boxes to match page (check Tutorials section for help)
  6. Replace placeholder text with whatever you'd like
  7. That's it! If you are having trouble getting these to work, please make sure you have followed all listed steps and looked through the Tutorials page before messaging me.

The preview images display how they look with no style changes made. As the name suggests, the first set of boxes become larger when hovered over, but on mobile they are set to be taller with no expansion to make them easier to read. Hover effects can be a bit odd on mobile.

Hover Expanding Boxes Preview
Hover Expanding Boxes
Static Box Layout #1 Preview
Static Box Layout #1
Static Box Layout #2 Preview
Static Box Layout #2