Profile
I will be adding <a> element (links) in the near future as well!
A Quick Guide to Coloring Common Elements
1. Boxes (<div>)
To bootstrap color boxes such as <div>, simply add class="bg-color" to each <div> elements!
Bootstrap bg colors are the following:
Primary Secondary Danger Success Warning Info Light White Dark Faded
Yes, there's no bg-black for some reason. (This entire box is in bg-faded color!)
For example:
<div class="bg-faded">
<div class="bg-faded rounded p-2">
Hint: Bootstrap colors are named not based on their colors, but moreso on their intended usage! This is why bootstrap themes changes colors when your change your toyhou.se's website theme!
Bootstrap bg colors are the following:
Primary Secondary Danger Success Warning Info Light White Dark Faded
Yes, there's no bg-black for some reason. (This entire box is in bg-faded color!)
For example:
<div class="bg-faded">
<div class="bg-faded rounded p-2">
Hint: Bootstrap colors are named not based on their colors, but moreso on their intended usage! This is why bootstrap themes changes colors when your change your toyhou.se's website theme!
To custom color boxes such as <div>, simply add style="background-color:" to each <div> elements! Do note to erase any bootstrap colors before adding the custom color in!
For example:
<div class="rounded p-2" style="background-color:#333333">
<div class="rounded p-2" style="background-color:#333333;font-size:0.9em;letter-spacing:0.5px;">
The placement/order of the background-color attribute does not matter! It can be placed wherever, but I prefer to place them in front of the other attributes because it's easier/faster to read and notice, and therefore easier to edit.
For example:
<div class="rounded p-2" style="background-color:#333333">
<div class="rounded p-2" style="background-color:#333333;font-size:0.9em;letter-spacing:0.5px;">
The placement/order of the background-color attribute does not matter! It can be placed wherever, but I prefer to place them in front of the other attributes because it's easier/faster to read and notice, and therefore easier to edit.
2. Texts (<p>, <span>, plaintext inside <div>)
To bootstrap color text elements such as <p>, <span>, or texts inside <div> elements, simply add class="text-color" to each of thos elements!
Bootstrap text colors are the following:
Primary Secondary Danger Success Warning Info Light White Dark Muted
There's no text-black here either!
For example:
<p class="text-primary">
<span class="text-uppercase text-primary">
<div class="text-light bg-primary rounded p-3">
Bootstrap text colors are the following:
Primary Secondary Danger Success Warning Info Light White Dark Muted
There's no text-black here either!
For example:
<p class="text-primary">
<span class="text-uppercase text-primary">
<div class="text-light bg-primary rounded p-3">
To custom color text elements such as <p>, <span>, or texts inside <div> elements, simply add style="color:" to each of thos elements! Do note to erase any bootstrap colors before adding the custom color in!
For example:
<p style="color:#333">
<span class="text-uppercase" style="color:#333333;font-size:0.9em;letter-spacing:0.5px;">
<div class="bg-primary rounded p-3" style="color:#333333;font-size:0.9em;letter-spacing:0.5px;">
Same deal of the boxes above, the placement/order of the color attribute does not matter! It can be placed wherever, but I prefer to place them in front of the other attributes because it's easier/faster to read and notice, and therefore easier to edit.
For example:
<p style="color:#333">
<span class="text-uppercase" style="color:#333333;font-size:0.9em;letter-spacing:0.5px;">
<div class="bg-primary rounded p-3" style="color:#333333;font-size:0.9em;letter-spacing:0.5px;">
Same deal of the boxes above, the placement/order of the color attribute does not matter! It can be placed wherever, but I prefer to place them in front of the other attributes because it's easier/faster to read and notice, and therefore easier to edit.
Recent Images
No images.