Gottwin, Funken

World Styling Editor

SELECT THEME

CUSTOM CSS

@font-face {
  font-family: Metamorphous;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/metamorphous/v11/Wnz8HA03aAXcC39ZEX5y133EOyqs.woff2) ;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Eagle Lake;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/eaglelake/v8/ptRMTiqbbuNJDOiKj9wG1On4KA.woff2);
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: IM Fell DW Pica;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/imfelldwpica/v10/2sDGZGRQotv9nbn2qSl0TxXVYNwNYwnV.woff2);
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: IM Fell DW Pica;
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/imfelldwpica/v10/2sDEZGRQotv9nbn2qSl0TxXVYNwNZjnXlis.woff2);
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: IM Fell DW Pica SC;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/imfelldwpicasc/v10/0ybjGCAu5PfqkvtGVU15aBhXz3EUrnTm_xKL.woff2);
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Bilbo;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/bilbo/v10/o-0EIpgpwWwZ220mroU.woff2);
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Bilbo Swash Caps;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/bilboswashcaps/v13/zrf-0GXbz-H3Wb4XBsGrTgq2PVmdmATipw.woff2);
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Alegreya;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/alegreya/v16/4UaBrEBBsBhlBjvfkSLhx6g.woff2);
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Alegreya;
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/alegreya/v16/4UaHrEBBsBhlBjvfkSLk96rp5w.woff2);
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Alegreya;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/alegreya/v16/4UaGrEBBsBhlBjvfkSoS5L3Owp4.woff2);
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Alegreya;
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/alegreya/v16/4UaErEBBsBhlBjvfkSLk_1nK8pxULg.woff2);
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Jim Nightshade;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/jimnightshade/v7/PlIkFlu9Pb08Q8HLM1PxmB0g-NS_XXs.woff2);
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: Caveat;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/caveat/v7/Wnz6HAc5bAfYB2Q7ZjYY.woff2) ;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Alegreya SC;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/alegreyasc/v14/taiOGmRtCJ62-O0HhNEa-Z6v2ZA.woff2);
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Fondamento;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/fondamento/v11/4UaHrEJGsxNmFTPDnkaJ96rp5w.woff2);
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

.user-css .article-title h1 {
    font-family: Metamorphous;
    font-weight: 700;
    font-size: 66px;
    text-align: center;
    padding-top: 10px;
    padding-bottom: 0px;

margin-top: 20px;
    margin-bottom: 5px;
    background: -webkit-linear-gradient(
               RGB(71, 33, 47),
              RGB(71, 33, 47),                  
              RGB(155, 153, 143),
              RGB(71, 33, 47),
              RGB(71, 33, 47),
              RGB(71, 33, 47));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.user-css h2 {
    color: #47212F;
    font-family: Fondamento;
    font-weight: 700;
    font-size: 28px;
    padding-bottom: 2px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #47212F;
   
    line-height: 1.3em;
}
.user-css h3 {
    color: #2B437F;
    font-family: IM Fell DW Pica SC;
    font-weight: 700;
    font-size: 26px;
    margin-top: 0px;
    margin-bottom: 4px;
    line-height: 1.3em;
    border: none;
}
.user-css h4 {
    color: #2B437F;
    font-family: IM Fell DW Pica;
    font-weight: 700;
    font-size: 22px;
    margin: 0;
    line-height: 1.3em;
    border: none;
}
.user-css h5 {

font-family: IM Fell DW Pica SC;
    font-weight: 700;
    font-size: 18px;
    color: #426CB0;
    margin-top: 5px;
    margin-bottom: 0px;
    line-height: 1.3em;
    border: none;
}

.user-css b {
    font-weight: 700;
    color: #59293A;
}

.user-css blockquote {
    background: rgba(255, 253, 243, 0.45);
    padding: 24px;
    margin: 10px;
    color: #47212F;
    border-left: 10px solid rgb(43, 67, 127);
    border-radius: 4px;
    border-bottom-right-radius: 4px;
    font-size: 1.1em;
    font-style: italic;
    line-height: 1.2 em;
    font-family: IM Fell DW Pica;
    box-shadow: 2px 2px 5px #47212F55;
}

.user-css blockquote .author {
    display: block;
    font-family: Bilbo;
    font-size: 1.1em;
    font-style: italic;
    font-weight: 700;
    text-align: right;
    color: #2B437F;
}
.user-css,
.user-css p,
.user-css-extended,
.user-css-extended p {
    font-family: IM FELL DW Pica;
    color: #47212F;
    font-size: 16px;
}

.user-css div .backtoworld a {
    position: absolute;
    top: -30px;
    left: -13px;
    padding: 7px 10px;
    padding-left: 13px;
    background: #47212F;
    color: #FFFDF3;
    font-size: 16px;
    font-family: IM Fell DW Pica SC;
    font-style: regular;
    box-shadow: 1px 1px 4px 2px #47212FDD;
}
.user-css div .backtoworld a:hover {
        background-color: #341822;
        color: #F5D5A5;
        top: -33px;
        left: -13px;
        padding: 10px 13px;
        padding-left: 16px;
    box-shadow: 1px 1px 12px 2px #47212FDD;
}

.user-css .heading .subheading {
    font-size: 1.9rem;
}

.user-css hr {
    border-color: #47212F;
   border: 1px solid;
}

.user-css .panel,
.user-css-extended .panel {
    background-color: rgba(255, 253, 243, 0.45) ;
    margin-bottom: 20px;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 2px 2px 5px #47212F55;
}

.user-css.page,
.user-css-extended .page {
    background: url(https://worldanvil.com/uploads/images/17be5390e317a5b35003244a03afe225.png) ;
   border: none
}
.user-css-presentation {
    background-image: url(https://www.worldanvil.com/uploads/images/0d47798b59be2b244691cf6e2f727182.png) ;
}

* {
    --heading-font: Metamorphous;
    --primary-color: RGB(71, 33, 47);
    --alt-color: RGB(43, 67, 127);
    --header-color: RGB(22, 27, 47);
    --secondary-color: RGB(66, 108, 176);
    --highlight-color: RGB(213, 120, 17);
    --border-color: RGB(71, 33, 47);
    --box-background: RGBA(253, 242, 221, 0.45);
}

.user-css .btn-primary,
.user-css-extended .btn-primary {
    padding: 5px 10px 5px 10px;
    border-radius: 10px;
    background-color:  #47212F;
    color: #FFFDF3;
    border: 0;
}
.user-css .btn-primary:active,
.user-css-extended .btn-primary:active {
    background-color:  #47212F;
}
.user-css .btn-primary:hover,
.user-css-extended .btn-primary:hover {
   background-color: #341822;
}
.user-css .btn-primary:active:hover,
.user-css-extended .btn-primary:active:hover {
    background-color: #161B2F;
}

.user-css a,
.user-css a:focus {
    color: #426CB0;
}
.user-css a:hover {
    font-weight: bold;
    color: #2B437F;
}

.user-css .map-box,
.user-css-extended .map-box {
    padding: 10px;
background: rgba(252, 233, 196, 0.45);
    border-radius: 8px;
    margin-bottom: 15px;
    color: #47212F;
    font-size: 1.1em;
    box-shadow: 0px 2px 5px #47212F55;
}
.user-css .map-box:hover,
.user-css-extended .map-box:hover {
    padding: 12px;
    box-shadow: 0px 2px 15px #47212F99;   
}

.user-css-secret {
    padding: 10px 14px;
    background-color: #08080814;
}
.user-css .artist-credits {
   background: rgba(209, 177, 61, 0.1);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    color: #9C4C04;
    font-size: 12px;
    line-height: 0px;
    padding:10px;
}

Need help? Check out the CSS Styling Guide

World Styling Editor

Gottwin, Funken

Kommentare

Find your way!

Resources

WHO WE ARE

LEGAL

Get the news

Worldbuilding Academy

Listen to our Podcast