Actions

Work Header

Rating:
Archive Warning:
Fandom:
Language:
English
Stats:
Published:
2026-06-17
Words:
892
Chapters:
1/1
Hits:
30

Indie pink green flowery site skin

Summary:

I've never created a site skin before but I wanted to try, so I did and I find it kinda cute, so here ya go:)

Notes:

Making this was honestly pretty fun and I like learning how to code stuff so if you want to, you can request a theme and I'll make it if I have some free time, maybe I could even make it a hobby of mine.
hope u like it:))

Work Text:

#header h1 sup,
#header .button,
#header .landmark,
#header .logo {
  display: none;
}

#header,
#inner.wrapper {
  margin: 0em 4%;
}

#main,
#inner,
.listbox .index,
.work.own,
.thread .even {
  background: #faf9d7;
}

#inner.wrapper {
  box-shadow: 0 0 5px #000;
  padding: 3em 0.5em 0.5em 0.5em;
  background: #e05c76;
  margin-top: 1em;
}

#main {
  border: 1px solid #e05c76;
}

#outer.wrapper {
  background-image: url("https://i.pinimg.com/736x/5f/59/7c/5f597c2ed6db33c0f4e172a869531ce5.jpg");
}

#header .heading a {
  color: #f5f7e1;
  position: absolute;
  right: 0.3em;
  top: 5.5em;
}

#header .heading {
  margin: 1em 0 0 1em;
  height: 14em;
  width: 14em;
  border-radius: 50%;
  background-image: url("https://i.pinimg.com/originals/e2/9d/65/e29d6544561afc275ab032fe6ad942bf.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 12em auto;
}

#header {
  background: #e05c76 url("https://i.pinimg.com/736x/f5/e7/17/f5e7179df569efaa80fa110b4c5442a6.jpg") repeat;
  box-shadow: 0 0 5px #000;
}

#header .primary li:first-child {
  margin-left: 0em;
}

#greeting {
  background: none;
  margin-right: 0em;
  position: absolute;
  right: 0em;
  top: 13em;
}

#greeting img.icon {
  box-shadow: 0 0 2px #000;
  border: 2px solid #fff;
  margin-right: 0.1em;
}

#greeting li,
#greeting li a {
  color: #fff !important;
  background: #cc314f;
}

#greeting li {
  margin-right: 0.3em !important;
}

#greeting .dropdown .menu li {
  margin: 0 0.125em !important;
}

#greeting li:last-child {
  margin-right: 0em !important;
}

#greeting .menu {
  width: 16em;
}

#footer {
  border: none;
  background: none;
}

.splash .favorite li:nth-of-type(odd) a {
  background: #fae3e7;
}

#workskin h2,
#footer,
#footer .menu,
#footer a,
.system .latest h3,
.splash .module h3,
.system .tweets h3 {
  color: #558556;
}

#footer h4 {
  color: #bf4747 !important;
}

.splash .favorite li:nth-of-type(odd) a:hover,
.splash .favorite li:nth-of-type(odd) a:focus,
a.tag:hover,
a.tag:focus,
#dashboard a:hover,
#dashboard a:focus,
#dashboard .current,
#header .dropdown .menu a:hover,
#header .dropdown .menu a:focus {
  background: #e05c76 !important;
  color: #fff !important;
}

#header .actions a:hover,
#header .actions a:focus,
#header .dropdown:hover a,
#header .open a,
#header .dropdown .menu a,
#header .dropdown .menu,
#greeting .dropdown .menu,
#greeting .dropdown .menu a {
  background: #f6fab4 !important;
  color: #000 !important;
}

#dashboard,
#dashboard.own {
  background: #fae3e7;
  color: #000;
  border: 2px solid #f5f7e1;
  box-shadow: 0 0 2px #000;
}

#header .dropdown .menu,
#greeting .dropdown .menu {
  border: 1px solid #e05c76;
}

#greeting .current,
#greeting .dropdown:hover li,
#greeting .dropdown:focus li {
  box-shadow: none;
  background: #f6fab4 !important;
  color: #000 !important;
}

#dashboard ul {
  background: transparent;
  border: none;
}

#dashboard .secondary {
  background-color: #f5e7ce;
  box-shadow: none;
}

.flash,
.notice,
.home .header h2,
.splash .module h3,
.splash .news li {
  border-color: #cc314f;
}

dl.meta,
li.comment,
.bookmark .user,
#header .menu li,
#dashboard ul,
#dashboard .secondary,
ul.notes,
tbody tr,
thead td,
#header #small_login,
fieldset,
form dl,
fieldset dl dl,
fieldset fieldset fieldset,
fieldset fieldset dl dl,
dd.hideme,
form blockquote.userstuff,
form dt,
.actions a:active,
.current,
a.current,
.current a:visited,
.search span.tip,
.listbox,
fieldset fieldset.listbox {
  border-color: #69B99D;
}

#main .verbose legend,
li.relationships a,
.statistics .index li:nth-of-type(even),
dl.index dd,
.unread,
.child,
.unwrangled,
.unreviewed,
.verbose fieldset,
.draft,
form ul.notes,
#modal,
.ui-sortable li,
div.dynamic,
#ui-datepicker-div,
.ui-datepicker table {
  background-color: #fae3e7;
  border-color: #e05c76;
}

.flash,
.notice {
  background-color: #fcffdf;
}

form .notice,
ul.notes,
.caution {
  background-color: #f5e7ce;
  border-color: #4a8760;
}

.alert.flash,
.error,
.comment_error,
.kudos_error {
  background: #efd1d1;
  color: #000;
  border-color: #bf4747;
}

h2 {
  font-size: 1.286em;
  line-height: 1;
  margin: 0.5375em 0;
}

.listbox,
.comment h4.byline,
.bookmark .user,
.bookmark .user .header,
.bookmark .user .datetime,
.reading h4.viewed,
.blurb .datetime,
.dropdown,
fieldset fieldset.listbox,
fieldset,
form dl,
fieldset dl dl,
fieldset fieldset fieldset,
fieldset fieldset dl dl,
dd.hideme,
form blockquote.userstuff,
.dynamic form fieldset,
.toggled form fieldset,
.toggled form dl,
.secondary .toggled form,
.secondary form,
.required .autocomplete {
  background-color: #f6fab4;
}

.filters .submit input {
  color: #FFF;
  background: #e05c76;
  box-shadow: 0 0 4px #000;
  border: none;
}

li.blurb,
.listbox li.blurb,
li.comment,
dl.meta,
#ibox_wrapper,
#ibox_content,
textarea:focus,
input:focus,
select:focus {
  background-color: #f5e7ce;
}

textarea,
input,
select,
option,
.toggled form,
.dynamic form,
.autocomplete .dropdown ul,
.autocomplete .dropdown ul li,
.autocomplete input {
  background-color: #faf9d7;
}

li.blurb,
.listbox li.blurb {
  box-shadow: 0px 0px 4px #000;
  border: 1px solid #cc314f;
  border-radius: 5px;
}

.blurb .header {
  border-bottom: 1px solid #cc314f;
}

.bookmark .user .module {
  border: none;
}

.reading h4.viewed,
.bookmark .user {
  box-shadow: none;
}

.reading h4.viewed {
  border: 1px dashed #cc314f;
}

.icon {
  border: 2px solid #fff;
}

.comment div.icon {
  border-bottom: none;
}

#workskin .notes,
dl.meta,
.reading h4.viewed,
.bookmark .user,
.comment .posted,
.comment .edited {
  font-size: 90%;
}

#workskin {
  text-align: justify;
}

#workskin h2 {
  font-size: 2.7em;
}

ul.tags li.warnings,
ul.tags li.relationships,
ul.tags li.characters,
ul.tags li.freeforms {
  float: left !important;
  margin: 0;
  padding: 2px;
}

li.warnings + li.relationships,
li.relationships + li.characters,
li.characters + li.freeforms,
li.warnings + li.characters,
li.warnings + li.freeforms,
li.relationships + li.freeforms {
  clear: left;
}

ul.tags li.warnings:first-child:before {
  content: "Warnings: ";
  color: #000;
  font-family: Georgia,serif;
  font-weight: 600;
}

li.warnings + li.relationships:before {
  content: "Relationships: ";
  color: #000;
  font-family: Georgia,serif;
  font-weight: 600;
}

li.relationships + li.characters:before {
  content: "Characters: ";
  color: #000;
  font-family: Georgia,serif;
  font-weight: 600;
}

li.characters + li.freeforms:before {
  content: "Other tags: ";
  color: #000;
  font-family: Georgia,serif;
  font-weight: 600;
}

li.warnings + li.characters:before {
  content: "Characters: ";
  color: #000;
  font-family: Georgia,serif;
  font-weight: 600;
}

li.warnings + li.freeforms:before {
  content: "Other tags: ";
  color: #000;
  font-family: Georgia,serif;
  font-weight: 600;
}

li.relationships + li.freeforms:before {
  content: "Other tags: ";
  color: #000;
  font-family: Georgia,serif;
  font-weight: 600;
}

li.blurb blockquote p:first-child::before {
  content: "About: ";
  color: #000;
  font-size: 95%;
  font-family: Georgia,serif;
  font-weight: 600;
}

.blurb ul.series::before {
  content: "Series: ";
  color: #000;
  font-family: Georgia,serif;
  font-weight: 600;
}

.blurb .fandoms::before {
  content: "Fandom: ";
  color: #000;
  font-family: Georgia,serif;
  font-weight: 600;
}

#header h2 {
  background-color: #773839 !important;
}