Как мы можем настроить ионные иконки? Когда выбран значок - PullRequest
0 голосов
/ 04 октября 2019

Когда я использую пользовательскую иконку-ион, я хочу использовать один и тот же значок для двух разных видов. Как я могу это сделать?

enter image description here

этоэто значок, который я хочу настроить

Сейчас я использую нижеприведенный подход. Но он не может быть заполнен при помощи значка.

<ion-icon fill="black" src="../../assets/icon/Group 3.svg"></ion-icon>

это файл svg

 <svg xmlns="http://www.w3.org/2000/svg" width="84.266" height="78.245" viewBox="0 0 84.266 78.245">
      <defs>
      
        <style>
          .cls-1 {
            fill: #da2128;
          }
    
          .cls-2 {
            fill: none;
            stroke: #fff;
            stroke-miterlimit: 10;
            stroke-width: 0.25px;
          }
    
        </style>
        
      </defs>
      <g id="Group_3" data-name="Group 3" transform="translate(0.125 0.125)">
        <path id="Path_7" data-name="Path 7" class="cls-1" d="M634.165,417.2c-.72-.086-1.442-.149-2.158-.261a13.193,13.193,0,0,1-6.673-2.743,6.106,6.106,0,0,1-2.227-4.723c-.011-.455,0-.911,0-1.4-.233,0-.44-.011-.645,0a21.262,21.262,0,0,1-8.335-.814,10.088,10.088,0,0,1-5.028-3.389,4.3,4.3,0,0,1-.814-2.519c-.087-2.283-.176-4.569-.173-6.853q.011-15.452.083-30.905a3.87,3.87,0,0,1,1-2.223,8.973,8.973,0,0,1,4.285-3.008,18.288,18.288,0,0,1,14.464.552,8.4,8.4,0,0,1,2.887,2.239,4.58,4.58,0,0,1,1.1,2.858c.075,1.8.159,3.6.164,5.4.021,6.787.011,13.575.014,20.362v.474c.768,0,1.5.02,2.238,0a16.891,16.891,0,0,1,8.78,1.775,11.553,11.553,0,0,1,2.05,1.458,5.239,5.239,0,0,1,1.847,4.125q.011,6.085,0,12.171a5.986,5.986,0,0,1-3.173,5.194,14.106,14.106,0,0,1-5.641,1.982c-.717.108-1.438.176-2.158.26Zm.943-14.991c1.258-.148,2.532-.218,3.772-.463a8.616,8.616,0,0,0,3.97-1.8,2.7,2.7,0,0,0,.007-4.515,8.184,8.184,0,0,0-2.533-1.4,18.42,18.42,0,0,0-6.591-.772,11.741,11.741,0,0,0-5.045,1.31,5.344,5.344,0,0,0-2.027,1.608,2.332,2.332,0,0,0,.018,3.036,5.711,5.711,0,0,0,2.175,1.691,15.589,15.589,0,0,0,6.255,1.295m-15.043-33.1a16.539,16.539,0,0,0,4.4-.536,7.421,7.421,0,0,0,3.975-2.287,2.4,2.4,0,0,0,.108-3.111,5.5,5.5,0,0,0-2.007-1.631,12.161,12.161,0,0,0-4.8-1.237,15.507,15.507,0,0,0-6.468.562,7.5,7.5,0,0,0-3.476,2.083,2.509,2.509,0,0,0,.072,3.49,6.9,6.9,0,0,0,1.7,1.265,13.855,13.855,0,0,0,6.494,1.4m.027,6.017c.683-.038,1.369-.059,2.051-.118a10.748,10.748,0,0,0,5.356-1.83,3.281,3.281,0,0,0,1.574-2.338c.024-.214.035-.522-.087-.634s-.432-.034-.624.044c-.779.313-1.531.7-2.318.987a17.655,17.655,0,0,1-5.56.806,16.644,16.644,0,0,1-8.453-1.7,2.728,2.728,0,0,0-.477-.187c-.292-.087-.469-.011-.465.339a2.783,2.783,0,0,0,.522,1.643,5.723,5.723,0,0,0,2.131,1.679,13.7,13.7,0,0,0,6.35,1.312m-.031,6.029c.953-.077,1.91-.114,2.856-.236a10.15,10.15,0,0,0,4.59-1.742,3.289,3.289,0,0,0,1.569-2.342c.023-.214.027-.524-.1-.628s-.429-.017-.623.062c-.765.311-1.5.686-2.277.971a18.426,18.426,0,0,1-5.9.814,16.308,16.308,0,0,1-8.075-1.674,3.241,3.241,0,0,0-.6-.235c-.259-.072-.412.023-.413.318a2.751,2.751,0,0,0,.5,1.65,5.724,5.724,0,0,0,2.158,1.711,14.039,14.039,0,0,0,6.312,1.331m.027,5.979c.713-.039,1.427-.059,2.138-.122a10.744,10.744,0,0,0,5.236-1.8,3.316,3.316,0,0,0,1.611-2.36c.025-.214.035-.516-.087-.634-.1-.1-.426-.028-.617.051-.765.308-1.5.686-2.277.971a16.813,16.813,0,0,1-5.689.807,16.331,16.331,0,0,1-6.482-.9c-.777-.315-1.544-.659-2.325-.967-.374-.148-.5-.041-.5.353a2.671,2.671,0,0,0,.515,1.6,5.723,5.723,0,0,0,2.13,1.68,13.654,13.654,0,0,0,6.35,1.313m-.016,6c.713-.039,1.427-.062,2.137-.122a10.663,10.663,0,0,0,5.274-1.813,3.189,3.189,0,0,0,1.553-2.2,4.31,4.31,0,0,0-.048-.814,3.926,3.926,0,0,0-.766.143c-.887.349-1.745.779-2.646,1.081a17.694,17.694,0,0,1-5.329.652,16.193,16.193,0,0,1-6.832-1.089c-.614-.263-1.224-.538-1.843-.791-.321-.132-.488-.015-.482.347a2.77,2.77,0,0,0,.509,1.6,5.679,5.679,0,0,0,2.124,1.688,13.61,13.61,0,0,0,6.348,1.319m15.033,15.008c.727-.041,1.455-.06,2.18-.126a10.637,10.637,0,0,0,5.193-1.792,3.265,3.265,0,0,0,1.58-2.239,3.936,3.936,0,0,0-.044-.779,3.452,3.452,0,0,0-.762.124c-.793.316-1.558.708-2.359,1a17.224,17.224,0,0,1-5.529.748,16.286,16.286,0,0,1-6.919-1.088c-.614-.264-1.223-.543-1.846-.784-.378-.146-.5-.045-.5.357a2.705,2.705,0,0,0,.519,1.6,5.686,5.686,0,0,0,2.093,1.66,13.494,13.494,0,0,0,6.389,1.324m-.007,6.031c.98-.08,1.968-.111,2.941-.25a9.847,9.847,0,0,0,4.739-1.92,3.1,3.1,0,0,0,1.309-2.128c.024-.214.032-.513-.09-.634-.1-.1-.4.011-.617.045a.9.9,0,0,0-.277.11,14.882,14.882,0,0,1-6.743,1.657,18.2,18.2,0,0,1-7.942-1.074c-.55-.236-1.088-.5-1.642-.723-.578-.235-.723-.118-.666.51a2.526,2.526,0,0,0,.843,1.774,10.969,10.969,0,0,0,1.915,1.344,13.443,13.443,0,0,0,6.232,1.289M623.265,396.1c-1,0-1.929-.006-2.855,0a16.637,16.637,0,0,1-6.272-.86c-.848-.329-1.678-.7-2.526-1.036-.406-.159-.52-.062-.517.371a3.027,3.027,0,0,0,1.33,2.423,8.987,8.987,0,0,0,4.692,1.909c1.837.177,3.7.089,5.554.124.267.006.337-.12.357-.358.069-.838.153-1.673.238-2.574m-.176,6c-.983,0-1.923,0-2.862,0a16.687,16.687,0,0,1-6.586-1.032c-.671-.277-1.328-.585-2-.852-.433-.17-.55-.074-.544.377a2.782,2.782,0,0,0,.8,1.926,6.346,6.346,0,0,0,2.186,1.469,15.841,15.841,0,0,0,7.791,1.094c.4-.037.81-.087,1.217-.132Z" transform="translate(-608.111 -339.206)"/>
        <path id="Path_8" data-name="Path 8" class="cls-2" d="M634.165,417.2c-.72-.086-1.442-.149-2.158-.261a13.193,13.193,0,0,1-6.673-2.743,6.106,6.106,0,0,1-2.227-4.723c-.011-.455,0-.911,0-1.4-.233,0-.44-.011-.645,0a21.262,21.262,0,0,1-8.335-.814,10.088,10.088,0,0,1-5.028-3.389,4.3,4.3,0,0,1-.814-2.519c-.087-2.283-.176-4.569-.173-6.853q.011-15.452.083-30.905a3.87,3.87,0,0,1,1-2.223,8.973,8.973,0,0,1,4.285-3.008,18.288,18.288,0,0,1,14.464.552,8.4,8.4,0,0,1,2.887,2.239,4.58,4.58,0,0,1,1.1,2.858c.075,1.8.159,3.6.164,5.4.021,6.787.011,13.575.014,20.362v.474c.768,0,1.5.02,2.238,0a16.891,16.891,0,0,1,8.78,1.775,11.553,11.553,0,0,1,2.05,1.458,5.239,5.239,0,0,1,1.847,4.125q.011,6.085,0,12.171a5.986,5.986,0,0,1-3.173,5.194,14.106,14.106,0,0,1-5.641,1.982c-.717.108-1.438.176-2.158.26Zm.943-14.991c1.258-.148,2.532-.218,3.772-.463a8.616,8.616,0,0,0,3.97-1.8,2.7,2.7,0,0,0,.007-4.515,8.184,8.184,0,0,0-2.533-1.4,18.42,18.42,0,0,0-6.591-.772,11.741,11.741,0,0,0-5.045,1.31,5.344,5.344,0,0,0-2.027,1.608,2.332,2.332,0,0,0,.018,3.036,5.711,5.711,0,0,0,2.175,1.691A15.589,15.589,0,0,0,635.108,402.21Zm-15.043-33.1a16.539,16.539,0,0,0,4.4-.536,7.421,7.421,0,0,0,3.975-2.287,2.4,2.4,0,0,0,.108-3.111,5.5,5.5,0,0,0-2.007-1.631,12.161,12.161,0,0,0-4.8-1.237,15.507,15.507,0,0,0-6.468.562,7.5,7.5,0,0,0-3.476,2.083,2.509,2.509,0,0,0,.072,3.49,6.9,6.9,0,0,0,1.7,1.265A13.855,13.855,0,0,0,620.065,369.114Zm.027,6.017c.683-.038,1.369-.059,2.051-.118a10.748,10.748,0,0,0,5.356-1.83,3.281,3.281,0,0,0,1.574-2.338c.024-.214.035-.522-.087-.634s-.432-.034-.624.044c-.779.313-1.531.7-2.318.987a17.655,17.655,0,0,1-5.56.806,16.644,16.644,0,0,1-8.453-1.7,2.728,2.728,0,0,0-.477-.187c-.292-.087-.469-.011-.465.339a2.783,2.783,0,0,0,.522,1.643,5.723,5.723,0,0,0,2.131,1.679A13.7,13.7,0,0,0,620.092,375.131Zm-.031,6.029c.953-.077,1.91-.114,2.856-.236a10.15,10.15,0,0,0,4.59-1.742,3.289,3.289,0,0,0,1.569-2.342c.023-.214.027-.524-.1-.628s-.429-.017-.623.062c-.765.311-1.5.686-2.277.971a18.426,18.426,0,0,1-5.9.814,16.308,16.308,0,0,1-8.075-1.674,3.241,3.241,0,0,0-.6-.235c-.259-.072-.412.023-.413.318a2.751,2.751,0,0,0,.5,1.65,5.724,5.724,0,0,0,2.158,1.711A14.039,14.039,0,0,0,620.061,381.16Zm.027,5.979c.713-.039,1.427-.059,2.138-.122a10.744,10.744,0,0,0,5.236-1.8,3.316,3.316,0,0,0,1.611-2.36c.025-.214.035-.516-.087-.634-.1-.1-.426-.028-.617.051-.765.308-1.5.686-2.277.971a16.813,16.813,0,0,1-5.689.807,16.331,16.331,0,0,1-6.482-.9c-.777-.315-1.544-.659-2.325-.967-.374-.148-.5-.041-.5.353a2.671,2.671,0,0,0,.515,1.6,5.723,5.723,0,0,0,2.13,1.68A13.654,13.654,0,0,0,620.088,387.139Zm-.016,6c.713-.039,1.427-.062,2.137-.122a10.663,10.663,0,0,0,5.274-1.813,3.189,3.189,0,0,0,1.553-2.2,4.31,4.31,0,0,0-.048-.814,3.926,3.926,0,0,0-.766.143c-.887.349-1.745.779-2.646,1.081a17.694,17.694,0,0,1-5.329.652,16.193,16.193,0,0,1-6.832-1.089c-.614-.263-1.224-.538-1.843-.791-.321-.132-.488-.015-.482.347a2.77,2.77,0,0,0,.509,1.6,5.679,5.679,0,0,0,2.124,1.688A13.61,13.61,0,0,0,620.072,393.142Zm15.033,15.008c.727-.041,1.455-.06,2.18-.126a10.637,10.637,0,0,0,5.193-1.792,3.265,3.265,0,0,0,1.58-2.239,3.936,3.936,0,0,0-.044-.779,3.452,3.452,0,0,0-.762.124c-.793.316-1.558.708-2.359,1a17.224,17.224,0,0,1-5.529.748,16.286,16.286,0,0,1-6.919-1.088c-.614-.264-1.223-.543-1.846-.784-.378-.146-.5-.045-.5.357a2.705,2.705,0,0,0,.519,1.6,5.686,5.686,0,0,0,2.093,1.66A13.494,13.494,0,0,0,635.105,408.15Zm-.007,6.031c.98-.08,1.968-.111,2.941-.25a9.847,9.847,0,0,0,4.739-1.92,3.1,3.1,0,0,0,1.309-2.128c.024-.214.032-.513-.09-.634-.1-.1-.4.011-.617.045a.9.9,0,0,0-.277.11,14.882,14.882,0,0,1-6.743,1.657,18.2,18.2,0,0,1-7.942-1.074c-.55-.236-1.088-.5-1.642-.723-.578-.235-.723-.118-.666.51a2.526,2.526,0,0,0,.843,1.774,10.969,10.969,0,0,0,1.915,1.344A13.443,13.443,0,0,0,635.1,414.181ZM623.265,396.1c-1,0-1.929-.006-2.855,0a16.637,16.637,0,0,1-6.272-.86c-.848-.329-1.678-.7-2.526-1.036-.406-.159-.52-.062-.517.371a3.027,3.027,0,0,0,1.33,2.423,8.987,8.987,0,0,0,4.692,1.909c1.837.177,3.7.089,5.554.124.267.006.337-.12.357-.358C623.1,397.836,623.181,397,623.265,396.1Zm-.176,6c-.983,0-1.923,0-2.862,0a16.687,16.687,0,0,1-6.586-1.032c-.671-.277-1.328-.585-2-.852-.433-.17-.55-.074-.544.377a2.782,2.782,0,0,0,.8,1.926,6.346,6.346,0,0,0,2.186,1.469,15.841,15.841,0,0,0,7.791,1.094c.4-.037.81-.087,1.217-.132Z" transform="translate(-608.111 -339.206)"/>
        <path id="Path_9" data-name="Path 9" class="cls-1" d="M687.8,402.055c-.016.254-.045.51-.047.765-.014,2.915-.02,5.831-.042,8.745a2.11,2.11,0,0,1-.18.772,7.018,7.018,0,0,1-3.9,3.824,1.651,1.651,0,0,1-.617.118q-8.036.029-16.075.044l-19.678.049a1.514,1.514,0,0,1-1.336-2.083,1.222,1.222,0,0,1,1.248-.848q11.916-.013,23.833-.105c3.558-.024,7.116-.084,10.672-.138a7.194,7.194,0,0,0,1.278-.115,2.5,2.5,0,0,0,1.66-2.12c.044-.683.082-1.369.084-2.055q.048-14.018.086-28.036c0-.395,0-.79,0-1.295-.607.337-1.1.609-1.591.887q-15.846,9-31.691,18c-1.475.836-2.975,1.632-4.469,2.435a1.243,1.243,0,0,1-1.92-.872,1.117,1.117,0,0,1,.589-1.438q7.237-4.234,14.482-8.454c3.07-1.782,6.159-3.535,9.246-5.29a.623.623,0,0,0,.374-.626q-.061-15.54-.1-31.081c0-1.071-.09-2.142-.076-3.214a2.468,2.468,0,0,0-2.459-2.418c-2.214.027-4.428-.072-6.644-.073q-16.848-.006-33.7.014c-.87,0-1.742.066-2.613.076a2.364,2.364,0,0,0-2.269,2.192c-.055,1.284-.118,2.568-.169,3.852-.06,1.513-.136,3.025-.156,4.539a1.336,1.336,0,0,1-1.811,1.122,1.5,1.5,0,0,1-1.043-1.467c.032-2.571.061-5.144.1-7.715a5.865,5.865,0,0,1,4.251-5.491,3.715,3.715,0,0,1,.976-.105q16.032-.042,32.065-.069c3.687,0,7.375.07,11.059.014a4.9,4.9,0,0,1,3,1.022,7.16,7.16,0,0,1,2.429,3.2,1.343,1.343,0,0,1,.063.5q.055,9.13.094,18.26a.69.69,0,0,0,.508.742c4.178,1.785,8.344,3.6,12.52,5.387a2.936,2.936,0,0,1,1.882,2.8c.021.468.058.935.087,1.4Zm-14.936-19.343.141.087,11.4-6.51c-.008-.052-.018-.1-.027-.155l-11.517-4.964Z" transform="translate(-603.786 -344.38)"/>
        <path id="Path_10" data-name="Path 10" class="cls-2" d="M687.8,402.055c-.016.254-.045.51-.047.765-.014,2.915-.02,5.831-.042,8.745a2.11,2.11,0,0,1-.18.772,7.018,7.018,0,0,1-3.9,3.824,1.651,1.651,0,0,1-.617.118q-8.036.029-16.075.044l-19.678.049a1.514,1.514,0,0,1-1.336-2.083,1.222,1.222,0,0,1,1.248-.848q11.916-.013,23.833-.105c3.558-.024,7.116-.084,10.672-.138a7.194,7.194,0,0,0,1.278-.115,2.5,2.5,0,0,0,1.66-2.12c.044-.683.082-1.369.084-2.055q.048-14.018.086-28.036c0-.395,0-.79,0-1.295-.607.337-1.1.609-1.591.887q-15.846,9-31.691,18c-1.475.836-2.975,1.632-4.469,2.435a1.243,1.243,0,0,1-1.92-.872,1.117,1.117,0,0,1,.589-1.438q7.237-4.234,14.482-8.454c3.07-1.782,6.159-3.535,9.246-5.29a.623.623,0,0,0,.374-.626q-.061-15.54-.1-31.081c0-1.071-.09-2.142-.076-3.214a2.468,2.468,0,0,0-2.459-2.418c-2.214.027-4.428-.072-6.644-.073q-16.848-.006-33.7.014c-.87,0-1.742.066-2.613.076a2.364,2.364,0,0,0-2.269,2.192c-.055,1.284-.118,2.568-.169,3.852-.06,1.513-.136,3.025-.156,4.539a1.336,1.336,0,0,1-1.811,1.122,1.5,1.5,0,0,1-1.043-1.467c.032-2.571.061-5.144.1-7.715a5.865,5.865,0,0,1,4.251-5.491,3.715,3.715,0,0,1,.976-.105q16.032-.042,32.065-.069c3.687,0,7.375.07,11.059.014a4.9,4.9,0,0,1,3,1.022,7.16,7.16,0,0,1,2.429,3.2,1.343,1.343,0,0,1,.063.5q.055,9.13.094,18.26a.69.69,0,0,0,.508.742c4.178,1.785,8.344,3.6,12.52,5.387a2.936,2.936,0,0,1,1.882,2.8c.021.468.058.935.087,1.4Zm-14.936-19.343.141.087,11.4-6.51c-.008-.052-.018-.1-.027-.155l-11.517-4.964Z" transform="translate(-603.786 -344.38)"/>
        <path id="Path_11" data-name="Path 11" class="cls-1" d="M632.01,383.762a4.834,4.834,0,0,1-.756-.26,1.1,1.1,0,0,1-.5-1.671c1.986-3.445,3.944-6.908,5.983-10.322,3.918-6.563,7.88-13.1,11.825-19.644.089-.146.2-.281.278-.432a1.442,1.442,0,0,1,2.411-.039.98.98,0,0,1,.063,1.186c-1.833,3.156-3.617,6.34-5.487,9.473-3.98,6.674-8,13.324-12.009,19.981-.228.378-.481.741-.714,1.116a1.282,1.282,0,0,1-1.1.611" transform="translate(-599.006 -341.792)"/>
        <path id="Path_12" data-name="Path 12" class="cls-2" d="M632.01,383.762a4.834,4.834,0,0,1-.756-.26,1.1,1.1,0,0,1-.5-1.671c1.986-3.445,3.944-6.908,5.983-10.322,3.918-6.563,7.88-13.1,11.825-19.644.089-.146.2-.281.278-.432a1.442,1.442,0,0,1,2.411-.039.98.98,0,0,1,.063,1.186c-1.833,3.156-3.617,6.34-5.487,9.473-3.98,6.674-8,13.324-12.009,19.981-.228.378-.481.741-.714,1.116A1.282,1.282,0,0,1,632.01,383.762Z" transform="translate(-599.006 -341.792)"/>
        <path id="Path_13" data-name="Path 13" class="cls-1" d="M646.152,378.447a4.865,4.865,0,0,1-4.345-2.258,8.855,8.855,0,0,1,.314-10.726,5.163,5.163,0,0,1,8,.053,8.7,8.7,0,0,1-.4,11.483,4.425,4.425,0,0,1-3.573,1.447m2.979-7.272a5.871,5.871,0,0,0-.97-3.3c-1.153-1.715-2.872-1.733-4.071-.048a5.289,5.289,0,0,0-.936,3.1,5.027,5.027,0,0,0,1.494,3.909,1.916,1.916,0,0,0,2.945,0,5.332,5.332,0,0,0,1.538-3.662" transform="translate(-595.112 -336.586)"/>
        <path id="Path_14" data-name="Path 14" class="cls-2" d="M646.152,378.447a4.865,4.865,0,0,1-4.345-2.258,8.855,8.855,0,0,1,.314-10.726,5.163,5.163,0,0,1,8,.053,8.7,8.7,0,0,1-.4,11.483A4.425,4.425,0,0,1,646.152,378.447Zm2.979-7.272a5.871,5.871,0,0,0-.97-3.3c-1.153-1.715-2.872-1.733-4.071-.048a5.289,5.289,0,0,0-.936,3.1,5.027,5.027,0,0,0,1.494,3.909,1.916,1.916,0,0,0,2.945,0A5.332,5.332,0,0,0,649.131,371.175Z" transform="translate(-595.112 -336.586)"/>
        <path id="Path_15" data-name="Path 15" class="cls-1" d="M633.369,365.625A4.954,4.954,0,0,1,628.8,363.1a8.793,8.793,0,0,1,.77-10.724,5.16,5.16,0,0,1,7.481.034,8.729,8.729,0,0,1-.107,11.741,4.381,4.381,0,0,1-3.578,1.477m2.953-7.318a5.935,5.935,0,0,0-1.053-3.361,2.189,2.189,0,0,0-3.784-.194,5.674,5.674,0,0,0,.385,7.3,1.916,1.916,0,0,0,2.885-.008,5.429,5.429,0,0,0,1.567-3.738" transform="translate(-600.31 -341.782)"/>
        <path id="Path_16" data-name="Path 16" class="cls-2" d="M633.369,365.625A4.954,4.954,0,0,1,628.8,363.1a8.793,8.793,0,0,1,.77-10.724,5.16,5.16,0,0,1,7.481.034,8.729,8.729,0,0,1-.107,11.741A4.381,4.381,0,0,1,633.369,365.625Zm2.953-7.318a5.935,5.935,0,0,0-1.053-3.361,2.189,2.189,0,0,0-3.784-.194,5.674,5.674,0,0,0,.385,7.3,1.916,1.916,0,0,0,2.885-.008A5.429,5.429,0,0,0,636.323,358.306Z" transform="translate(-600.31 -341.782)"/>
      </g>
    </svg>

1 Ответ

0 голосов
/ 04 октября 2019

В ТЕМУ ПАПКА ТЕМ

make icons.css

ion-icon {
  &[class*="custom-"] {
    mask-repeat: no-repeat;
    background: currentColor;
    width: 5em;
    height: 1.5em;
    background: center;
  }
  &[class*="custom-gmail-icon"] {
    background-image: url(../assets/img/ic_google_logo.png);

  }
  &[class*="custom-search-icon"] {
    mask-image: url(../assets/img/google_logo.png);
  }
}

тогда ваш app.css import

@import "../theme/icons";

наконец

<ion-icon  name="custom-gmail-icon"></ion-icon>
...