A easy process to create an icon library in SVG-format, that can be manipulated by CSS-files

[mimuel 7]

Hi,
I found an interesting solution for creating an icon library with affinity designer.

The icons can be manipulated globally with a CSS file.

The effort is relatively low.

Simply comment in an interest then I will describe the process here in the forum in detail. 

michael

[Jakerlund 168]

@mimuel yes absolutely

I want to export simple icons to be used in a html page and be able to change fill color in css.

Cheers

[mimuel 7]

OK - please wait a moment. The tutorial I have made is written in german language. After translate the tutorial I will public the pdf here.

[mimuel 7]

Hi Jakerlund,

here is the tutorial - sorry my software-dialogs are not english.

Please give me a feedback.

Cheers

Create a Icon Library.pdf

[Jakerlund 168]

Thanks @mimuel I'm going to test this tomorrow.

Thanks for sharing 

[Jakerlund 168]

@mimuel My problem is that i needed the SVG's to work in Wordpress with Elementor.
But... since i'm using JetElements i can use plain SVG's and the inline SVG widget which can remove Inline CSS and use custom colors in Elementor for my flat icons.

Your workaround will be appreciated when using traditional HTML/CSS though

Thanks for sharing!

[mimuel 7]

But I think outline-styles in a CSS is the better alternative

[mimuel 7]

At HTML5 you can call the SVG with this command:

        <object data="my_svg.svg" type="image/svg+xml"></object>

the svg himsef can include a inline-style or a reference to a outline-style CSS-File