Magento 2 : How reduce size of fotoroma gallery icons on product detail page

Question

I would like to reduce size of following icons appearing on detail page, enabled native fotoroma widget. 1. Fotoroma plus icon and minus icon 2. Fotoroma close icon

<var name="magnifier">
        <var name="fullscreenzoom">5</var>  <!-- Zoom for fullscreen (integer)-->
        <var name="top">5</var> <!-- Top position of magnifier -->
        <var name="left">780</var> <!-- Left position of magnifier -->
        <var name="width">200</var> <!-- Width of magnifier block -->
        <var name="height">200</var> <!-- Height of magnifier block -->
        <var name="eventType">hover</var> <!-- Action that atcivates zoom (hover/click) -->
        <var name="enabled">false</var> <!-- Turn on/off magnifier (true/false) -->
    </var>

Answer 1

The icons actually come by cropping a weird background which contain all the icons, located here - pub/static/frontend/Magento/luma/en_US/mage/gallery/gallery.png so you will have to adjust background-size, background-position and width and height of following elements to get your desired size of icons. Adjust your code as follows (done for + icon)

.fotorama__fullscreen .fotorama__zoom-in {
    background-position: 0 0 !important;
    background-size: 126px;
    top: 0;
}

fotorama__zoom-in.zoom-in-loaded {
    height: 16%;
    width: 4%;
}