Users Groups Gifts Transactions Develop Settings

ItteBlox CSS documentation

No style alert

Yellow alert

Dark Yellow alert

Orange alert

Blue alert

Pink alert

CODE EXAMPLE:
<div class="w-full mt-4 mb-4 rounded border text-white p-3">
<span>No style alert</span>
</div>
<div class="w-full mt-4 mb-4 rounded bg-yellow-500 border border-yellow-500 text-white p-3">
<span>Yellow alert</span>
</div>
<div class="w-full mt-4 mb-4 rounded bg-yellow-700 border border-yellow-700 text-white p-3">
<span>Dark Yellow alert</span>
</div>
<div class="w-full mt-4 mb-4 rounded bg-orange-400 border border-yellow-700 text-white p-3">
<span>Orange alert</span>
</div>
<div class="w-full mt-4 mb-4 rounded bg-blue-400 border border-blue-400 text-white p-3">
<span>Blue alert</span>
</div>
<div class="w-full mt-4 mb-4 rounded bg-pink-400 border border-pink-400 text-white p-3">
<span>Pink alert</span>
</div>

Header 1

Header 1 Bold

Header 1 Italic

Header 1 Underline

Header 2

Header 2 Bold

Header 2 Italic

Header 2 Underline

Header 3

Header 3 Bold

Header 3 Italic

Header 3 Underline

CODE EXAMPLE:
<h1 class="text-4xl">Header 1</h1>
<h1 class="text-4xl font-bold">Header 1 Bold</h1>
<h1 class="text-4xl"><i>Header 1 Italic</i></h1>
<h1 class="text-4xl"><u>Header 1 Underline</u></h1>
<h2 class="text-2xl">Header 2</h2>
<h2 class="text-2xl font-bold">Header 2 Bold</h2>
<h2 class="text-2xl"><i>Header 2 Italic</i></h2>
<h2 class="text-2xl"><u>Header 2 Underline</u></h2>
<h3 class="text-xl">Header 3</h3>
<h3 class="text-xl font-bold">Header 3 Bold</h3>
<h3 class="text-xl"><i>Header 3 Italic</i></h3>
<h3 class="text-xl"><u>Header 3 Underline</u></h3>

Text

Text Bold

Text Italic

Text Underline

Text Hyperlink

Text Bounce

CODE EXAMPLE:
<p>Text</p>
<p class="font-bold">Text Bold</p>
<p><i>Text Italic</i></p>
<p><u>Text Underline</u></p>
<a class="cursor-pointer text-blue-400" href="/">Text Hyperlink</a>
<p class="animate-bounce">Text Bounce</p>

Yellow Highlight

Dark Yellow Highlight

Orange Highlight

Blue Highlight

Pink Highlight

Black Highlight

White Highlight

CODE EXAMPLE:
<p><span class="bg-yellow-500 text-white">Yellow Highlight</span></p>
<p><span class="bg-yellow-700 text-white">Dark Yellow Highlight</span></p>
<p><span class="bg-orange-400 text-white">Orange Highlight</span></p>
<p><span class="bg-blue-400 text-white">Blue Highlight</span></p>
<p><span class="bg-pink-400 text-white">Pink Highlight</span></p>
<p><span class="bg-black text-white">Black Highlight</span></p>
<p><span class="bg-white text-black">White Highlight</span></p>

ItteBlox navbar:

Home Catalog Games Avatar Profile

Users Groups Gifts Transactions Develop Settings

CODE EXAMPLE:
<div style="display: contents;">
<div class="flex h-12 w-full place-items-center justify-center p-1 bg-[#303030] text-white/60">
<a class="mr-4" href="/">Home</a>
<a class="mr-4" href="/">Catalog</a>
<a class="mr-4" href="/">Games</a>
<a class="mr-4" href="/">Avatar</a>
<a href="/">Profile</a>
</div>
<div class="flex h-8 w-full place-items-center justify-center p-1 bg-[#232323] border-black/10 text-white/60">
<a class="mr-3" href="/">Users</a>
<a class="mr-3" href="/">Groups</a>
<a class="mr-3" href="/">Gifts</a>
<a class="mr-3" href="/">Transactions</a>
<a class="mr-3" href="/">Develop</a>
<a href="/">Settings</a>
</div>
!!!REST OF THE SITE CONTENTS GO IN HERE!!!
</div>

How to insert CSS:

Download the CSS

And paste this line of code below between <head> and </head>