I've uncovered the secrets of CSS chosting but if anyone has any tips for better text outlines or stroke, I would be interested. Right now it looks crusty af.
<div style="text-align: justify;padding: 10%;margin:2.5%;background: #fff4 linear-gradient(45deg, #000000, #fff433, #fbf9f5, #9b59d0, #000000);border: thick solid #ddd8;border-radius: 20px;box-shadow: 5px 5px 15px #0004;opacity:0.9;">
<h1 style="font-size: 1.5em; -webkit-text-stroke: 1px white">
text goes here
</h1>
</div>
help me my crops are dying
i would use a text-shadow. you can enhance the effect a bit by adding an alpha channel to the font color: #000000dd
<div style="text-align: justify;padding: 10%;margin:2.5%;background: #fff4 linear-gradient(45deg, #000000, #fff433, #fbf9f5, #9b59d0, #000000);border: thick solid #ddd8;border-radius: 20px;box-shadow: 5px 5px 15px #0004;opacity:0.9;">
<h1 style="font-size: 1.5em;color: #000000dd;text-shadow: 1px 1px 2px white, 0 0 0.1em white, 0 0 0.2em white;opacity:0.95;">
i would use a <span style="font-family:mono;font-size: 1.25rem">text-shadow</span>. you can enhance the effect a bit by adding an alpha channel to the font color: <span style="font-family:mono;font-size: 1.25rem">#000000dd</span>
</h1>
</div>
