Red Lights

/* TABLILLA DE PERSONAJE SIN EDICIÓN DE COLOR */

<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;900&display=swap" rel="stylesheet"><link rel="stylesheet" href="https://kit-pro.fontawesome.com/releases/v5.11.2/css/pro.min.css"/><link rel="stylesheet" href="https://dl.dropboxusercontent.com/s/3208kqh9oxga18q/redlights.css"/><div id="red-lights">
<div class="banner" style="background-image: url(https://via.placeholder.com/630x200);"></div>
<div class="second-skin">
<div class="titulo"><svg viewBox="0 0 500 500"><path id="curve" d="M73.2,148.6c4-6.1,65.5-96.8,178.6-95.6c111.3,1.2,170.8,90.3,175.1,97" /><text width="500"><textPath xlink:href="#curve">titu cortito</textPath></text></svg></div>
<div class="icon" style="background-image: url(https://via.placeholder.com/140x140);">
<div class="tag"><span class="fas fa-tag"></span>
<div class="tagging"><k>w/ <b>who</b> at the <b>place</b></k></div>
</div>
</div>
<div class="texto">Texto de prueba aquí. Las [b]palabras con este bbcode[/b] o también <b>con esta etiqueta, aparecerán de un tamaño diferente.</b>

A su vez, las letras [i]cursivas[/i] también cuentan con el mismo estilo.

</div>
</div>
</div><a href="https://valanwhistle.tumblr.com/" class="vared">VAC</a>
<style> #red-lights {--gradient1: 154, 20, 20; --white: #fff;} </style>



/* TABLILLA PARA EDITAR COLOR REPETIDAS VECES

Instrucciones

1. Cambia el nombre dentro del ID <div id="nombrePJ1"> por el nombre/id que prefieras.

2. Abajo en los estilos CSS edita también el #nombrePJ1 con el mismo nombre que le diste al ID, a continuación, podrás cambiar el color rgb 154, 20, 20 (ROJO) por el color rgb que prefieras.

3. Si compartes la tablilla con varios compañeros de rol en un mismo tema, cada uno de los participantes deberá ponerle su propia etiqueta ID en el HTML y el CSS que no sea la misma de otros compañeros y así pueda editar el color sin afectar la de su o sus compañeros de rol

EJEMPLO: Usuario uno reemplaza el

<div id="nombrePJ1">
por
<div id="pablo">
y el
#nombrePJ1
por
#pablo

y cambia el rgb --gradient1: 154, 20, 20
por
--gradient1: 116, 80, 159

Usuario dos reemplaza el

<div id="nombrePJ1">
por
<div id="uniqua">
y el
#nombrePJ1
por
#uniqua

y cambia el rgb --gradient1: 154, 20, 20
por
--gradient1: 198, 52, 165


Y así sucesivamente, para evitar que un color de una tablilla afecte a otro, etcétera. */


<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;900&display=swap" rel="stylesheet"><link rel="stylesheet" href="https://kit-pro.fontawesome.com/releases/v5.11.2/css/pro.min.css"/><link rel="stylesheet" href="https://dl.dropboxusercontent.com/s/3208kqh9oxga18q/redlights.css"/><div id="nombrePJ1"><div id="red-lights">
<div class="banner" style="background-image: url(https://via.placeholder.com/630x200);"></div>
<div class="second-skin">
<div class="titulo"><svg viewBox="0 0 500 500"><path id="curve" d="M73.2,148.6c4-6.1,65.5-96.8,178.6-95.6c111.3,1.2,170.8,90.3,175.1,97" /><text width="500"><textPath xlink:href="#curve">titu cortito</textPath></text></svg></div>
<div class="icon" style="background-image: url(https://via.placeholder.com/140x140);">
<div class="tag"><span class="fas fa-tag"></span>
<div class="tagging"><k>w/ <b>who</b> at the <b>place</b></k></div>
</div>
</div>
<div class="texto">Texto de prueba aquí. Las [b]palabras con este bbcode[/b] o también <b>con esta etiqueta, aparecerán de un tamaño diferente.</b>

A su vez, las letras [i]cursivas[/i] también cuentan con el mismo estilo.

</div>
</div>
</div><a href="https://valanwhistle.tumblr.com/" class="vared">VAC</a></div>
<style> #nombrePJ1 #red-lights {--gradient1: 154, 20, 20; --white: #fff;} </style>