SVG 컴포넌트의 색상이 같을 경우 컨트롤법
<svg width="28" height="28" viewBox="0 0 28 28" fill="none"
xmlns="http://www.w3.org/2000/svg">
{/* 하위에 있는 stroke, fill을 */}
<path d="M18.8123 7.875C18.5979 10.7663 16.4061 13.125 13.9998 13.125
C11.5936 13.125 9.39785 10.7669 9.1873 7.875C8.96855 4.86719 11.1014 2.625 13.9998 2.625C16.8982 2.625 19.0311 4.92188 18.8123 7.875Z" stroke="var(--gray-900)" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M14.0001 16.625C9.24232 16.625 4.41341 19.25 3.51982 24.2047C3.41209 24.8019 3.75005 25.375 4.37513 25.375H23.6251C24.2508 25.375 24.5887 24.8019 24.481 24.2047C23.5869 19.25 18.7579 16.625 14.0001 16.625Z" stroke="var(--gray-900)" stroke-width="1.5" stroke-miterlimit="10"/>
# </svg>
{/* 최상위로 빼주어도 됨 */}
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" stroke="var(--gray-900)"
xmlns="http://www.w3.org/2000/svg">
<path d="M18.8123 7.875C18.5979 10.7663 16.4061 13.125 13.9998 13.125C11.5936 13.125 9.39785 10.7669 9.1873 7.875C8.96855 4.86719 11.1014 2.625 13.9998 2.625C16.8982 2.625 19.0311 4.92188 18.8123 7.875Z" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M14.0001 16.625C9.24232 16.625 4.41341 19.25 3.51982 24.2047C3.41209 24.8019 3.75005 25.375 4.37513 25.375H23.6251C24.2508 25.375 24.5887 24.8019 24.481 24.2047C23.5869 19.25 18.7579 16.625 14.0001 16.625Z" stroke-width="1.5" stroke-miterlimit="10"/>
</svg>