<svg width="163" height="147" viewBox="0 0 163 147" fill="none">
<path d="M141.87 78.94L130.72 78.91L106.12 78.85L5.55007 78.94C2.99007 78.94 0.900046 81.01 0.900046 83.57V89.41C0.850046 105.52 13.8201 146.85 29.9301 146.89L106.03 146.74C114.71 146.76 122.53 134.8 127.91 121.24L141.78 121.27C153.45 121.3 162.97 111.82 163 100.15C163.03 88.48 153.55 78.96 141.88 78.93L141.87 78.94ZM141.79 114.29L130.42 114.26C133.51 104.78 135.32 95.37 135.34 89.41V85.93L141.86 85.95C149.68 85.97 156.02 92.34 156 100.16C155.98 107.98 149.61 114.32 141.79 114.3V114.29Z" fill="currentColor"/>
<path d="M55.0201 69.7C57.7101 64.64 60.7701 58.9 60.5201 48.11C60.2701 37.32 56.9501 31.73 54.0201 26.8C51.2001 22.04 48.7601 17.94 48.5501 9.08002C48.5101 7.34002 48.56 5.79 48.7 4.37C48.9 2.21 47.2201 0.350027 45.0501 0.340027C43.1401 0.340027 41.56 1.78999 41.38 3.67999C41.22 5.37999 41.15 7.22 41.19 9.25C41.44 20.04 44.76 25.63 47.69 30.56C50.51 35.32 52.9501 39.42 53.1601 48.28C53.3701 57.14 51.1201 61.35 48.5201 66.24C48.2401 66.77 47.9501 67.32 47.6601 67.87C46.3901 70.32 48.1601 73.25 50.9201 73.25H50.9301C52.3101 73.25 53.56 72.48 54.2 71.26C54.47 70.74 54.7501 70.22 55.0301 69.7H55.0201Z" fill="currentColor" class="steam"/>
<path d="M79.4201 69.14C82.1101 64.08 85.1701 58.34 84.9201 47.55C84.6701 36.76 81.3501 31.17 78.4201 26.24C75.6001 21.48 73.16 17.38 72.95 8.52002C72.91 6.99002 72.9501 5.60002 73.0501 4.33002C73.2201 2.21002 71.52 0.400024 69.39 0.400024C67.45 0.400024 65.86 1.89001 65.71 3.82001C65.59 5.32001 65.54 6.94001 65.58 8.70001C65.83 19.49 69.15 25.08 72.08 30.01C74.9 34.77 77.3401 38.87 77.5501 47.73C77.7601 56.59 75.51 60.8 72.91 65.69C72.52 66.42 72.13 67.16 71.73 67.94C70.49 70.38 72.28 73.28 75.02 73.28H75.03C76.41 73.28 77.6801 72.5 78.3001 71.27C78.6601 70.57 79.03 69.87 79.41 69.16L79.4201 69.14Z" fill="currentColor" class="steam"/>
<path d="M103.82 68.57C106.51 63.51 109.57 57.77 109.32 46.98C109.07 36.19 105.75 30.6 102.82 25.67C100 20.91 97.56 16.81 97.35 7.95001C97.32 6.67001 97.3501 5.49001 97.4101 4.39001C97.5401 2.26001 95.8901 0.440002 93.7501 0.440002C91.8001 0.440002 90.19 1.95001 90.07 3.89001C89.98 5.21001 89.95 6.62 89.99 8.12C90.24 18.91 93.56 24.5 96.49 29.43C99.31 34.19 101.75 38.29 101.96 47.15C102.17 56.01 99.92 60.22 97.32 65.11C96.83 66.03 96.33 66.98 95.83 67.97C94.63 70.4 96.4301 73.25 99.1401 73.25H99.1501C100.55 73.25 101.83 72.45 102.45 71.19C102.89 70.32 103.34 69.45 103.82 68.57Z" fill="currentColor" class="steam"/>
</svg>
<p>Cup has steam if Javascript is enabled.</p>
@media (scripting: none) {
.steam {
opacity: 0;
}
}
@media (scripting: enabled) {
.steam {
opacity: 1;
}
}
@layer demo.support {
html {
block-size: 100%;
color-scheme: dark light;
font-family: system-ui, sans-serif;
}
body {
min-block-size: 100%;
display: grid;
place-content: center;
place-items: center;
}
.steam {
transition: opacity .2s ease;
}
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.