Firma #1 | Watson

La firma es demasiado larga para la mayoría de los foros, por lo que deberá guardarla en una página HTML en un foro de prueba o en un host de código. Los colores de la firma son fácilmente modificables y están todos en el mismo lugar, al principio del código en la parte "root". Los iconos también son editables. Lo único que les pido es que no quiten los créditos.

------------------------------------------------------------------------- Pegar en una pagina HTML:
<style type="text/css">:root {
  --blanc: #ffffff;
  --color1: #c69362;
  --colordark: #b28457;
  --colorb: #85a587;
  --colorc: #769479;

}

.container {
  width: 400px;
  height: 305px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: rows;
  justify-content: center;
  align-items: flex-start;
  align-content: flex-start;
  gap: 5px;
}
.icon {
  color: var(--blanc);
  text-align: center;
  font-size: 25px;
  margin-top: 10px;
  text-shadow:  1px 2px var(--colordark);
}
.square {
  width: 50px;
  height: 50px;
  background-color: var(--color1);
  border: solid 2px var(--colordark);
}
.bloc:hover {
  background-color: var(--colorb);
  border: solid 2px var(--colorc);
  color: var(--blanc) !important;
}

.banner {
  height: 25px;
  width: 378px;
  background-color: var(--colorb);
  border: solid 2px var(--colorc);
}
.banner:hover {
  background-color: var(--color1);
  border: solid 2px var(--colordark);
}
.intro {
  color: var(--blanc);
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  margin-top: 3px;
  text-shadow: 1px 2px var(--colorc);
}
a:link, a:visited, a:active {
  text-decoration: none;
  color: var(--color1);
}
a:hover {
  text-decoration: none;
  color: var(--blanc);
}
.lien {
  text-align: center;
  font-size: 20px;
  margin-top: 13px;
  font-weight: 700;
}
.bloc {
  height: 50px;
  width: 125px;
  background-color: var(--blanc);
  border: solid 2px var(--color1);
  color: var(--color1);
  }</style><meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/><script src="//pull.cappuccicons.com/cpf.js"></script><div class="container"><img src="IMG" style="width: 378px; margin-top: 10px; border: 2px solid var(--color1);"><div class="banner"><div class="intro">
<a href="LIEN" style="color: var(--blanc); font-size: 14px;">CITA AQUI</a></div></div>
<div class="square"><div class="icon"><i class="cp cp-brush"></i></div></div>
<a href="LIEN1"><div class="bloc"><div class="ENLACE">Galerie</div></div></a><div class="square"><div class="icon"><i class="cp cp-shopping-cart"></i></div></div>
<a href="LIEN2"><div class="bloc"><div class="ENLACE">Boutique</div></div></a><div class="square"><div class="icon"><i class="cp cp-computer"></i></div></div>
<a href="LIEN3"><div class="bloc"><div class="ENLACE">Codes</div></div></a><div class="square"><div class="icon"><i class="cp cp-question"></i></div></div>
<a href="LIEN4"><div class="bloc"><div class="ENLACE">Forumspring</div></div></a><div class="banner"><div class="intro"><a href="https://www.pub-rpg-design.com/t139483-signature-1-watson#2382483" style="color: var(--blanc); font-size: 14px;">(c) WATSON</a></div></div>

------------------------------------------------------------------------- Pegar en la firma:

<center>
        <iframe style="width: 400px; height: 305px;" frameborder="no" scrolling="no" src="ENLACE DE LA PAGINA HTML"> </iframe>
</center>

------------------------------------------------------------------------- MODIFICAR los iconos:
Los iconos se encuentran en estas partes del código:

<i class="cp cp-question"></i>

Pueden encontrar la lista completa de íconos aquí: https://cappuccicons.com

Para modificar el ícono, simplemente reemplace el nombre (aquí "question") con el nombre del ícono que le interesa:
"cp cp-question"
Sustituyendo uno de los iconos por un icono de avellana será por tanto:
<i class="cp cp-acorn"></i>

¡No duden en contactarme si tienen alguna pregunta!