Allow an SVG icon to seamlessly blend with text

svg-icon.css

/* Courtesy of: https://www.24a11y.com/2018/accessible-svg-icons-with-inline-sprites/ */

.svg-icon {
    /* Place the icon on the text baseline. */
    position: relative;
    top: .125em;
    /* Prevent the icon from shrinking inside a flex container. */
    flex-shrink: 0;
    /* Scale the icon to match the font-size. */
    height: 1em;
    width: 1em;
    /* Let the icon take whatever color the parent has. */
    fill: currentColor;
}