How to Properly Use & Manage Custom Icons in Oxygen (No Images or Code Blocks!)

Описание: Oxygen already has a tutorial on importing icon sets – this is not a repeat of that. In this tutorial I'm going to walk you through step-by-step how to use custom icons (not from pre-made sets) in Oxygen even if you're given improperly formatted SVGs ... and even if you're not given SVGs at all.

I'm also going to show you the pitfalls of using SVGs as images (what most people do) and I discuss some pitfalls of using SVGs in code blocks (what a lot of other people do).

In the end ... the method I teach here is what I believe to be the best and most scalable method of using custom icons in Oxygen because it puts them all in a gallery to easily insert/swap and gives you global control over their styling with classes.

If you use a framework like Automatic.css this also means that your icons will be completely compatible with sweeping global color changes!

If you've struggled with custom icon management in Oxygen in the past, you're going to love this tutorial.

Make sure you hit the thumbs up and a drop a comment if you got value! If you want to see more from me, subscribe to the channel as well!

Automatic.css: https://automatic.css
Join the Inner Circle: https://digitalambition.co/inner-circle/
Envato Elements: https://geni.us/Ci9Rlz8

0:00 Intro & Context
01:22 Setting Up Our Icon Cards
03:23 Important Icon Properties
04:12 Choosing an Icon Set
04:55 Formatting the Icons (Wrong Way)
07:45 Using the Icons (Wrong Way)
10:32 Fixing SVG Stroke Issues
12:47 Importing SVGs to IcoMoon
14:11 Removing SVG Inline Styling
16:32 Importing Icons into Oxygen
17:24 Using Your Icons
20:07 Recap