JSFiddle - React, Tailwind, and code Playground

HTML

<h3 class="type1"> CSS Dictionary </h3>
<h3 class="type2"> CSS Dictionary </h3>
<div class="type3">
    <h3> CSS Dictionary - 엠보싱 효과 </h3>
</div>    
<h3 class="type4"> CSS Dictionary - 일식 효과 </h3>
<p class="type5"> CSS Dictionary - 그림자가 박스 크기는 벗어날 수 있으나 박스 크기를 변형 시키지는 않는다. </p>

CSS

.type1 {
    text-shadow : 0.2em 0.2em;
}
.type2 {
    text-shadow : #ccc 1px 1px 1px;
}
.type3 {
    background-color: #ddd;
    width: 500px;
    padding: 20px;
}
.type3 h3 {
    color: black;
    text-shadow : 2px 2px 1px white;
}
.type4 {
    background: white;
    color: white;
    text-shadow: black 0px 0px 5px;
}
.type5 {
    width: 300px;
    border: 1px solid #ccc;
    text-shadow: black 10px 10px 20px;
}