CSS Code

2 years, 6 months ago
64 1

The CSS code for my base character template. Used (and modified to fit) in all my HTML/CSS work. Questions and help requests gladly taken. (Click the blue title text "CSS Code" to open the file and see the code to copy and paste.)

Theme Lighter Light Dark Darker Reset
Text Serif Sans Serif Reset
Text Size Reset
Author's Notes

Just copy and paste this entire block of text into your character's profile. To do that, create the character, then under Manage Character in the left hand navigation, select Edit Profile. From there, paste this into the CSS window, and then click Update Character down at the bottom.

Advice: Have the character's profile page open in one tab and the Edit Profile page in another tab and simply refresh the main profile every time you edit and update the character to ensure the changes you make look how you want.

/* CSS Variables */
/* Bootstrap Colours */
:root {
  --primary: #0275d8;
  --success: #5cb85c;
  --info: #5bc0de;
  --warning: #f0ad4e;
  --danger: #d9534f;
  --inverse: #292b2c;
  --dark: #292b2c;
  --faded: #f7f7f7;
/*CSS Variables End */

html,body, .container-fluid {
  height: 100%;

.box {
  border: 1px solid var(--info);
  padding: 5px;
  border-radius: 10px;
/* Delete the border-radius property above to have square boxes. */

.row {
  margin-bottom: 15px;

.colmarg {
  padding-left: 7.5px;
  padding-right: 7.5px;