Fluent Style Icon Set

I created several icon sets in the Windows 11 "Fluent" style. All icons were created at 22 px (pixel perfect) and 32 px (pixel perfect) except "FLUENT_UI26_THIN" created at 22 px (pixel perfect) and 26 px (pixel perfect).

Fluent Icon Set:

(Update 21-June-2024)
--Fixed error in xml file (Thanks to @MartO for the info).

FLUENT.dis (1.8 MB)

Fluent UI Icon Set:

(Update 14-Nov-2024)
--Some of the line strokes are not aligned properly.

Fluent UI for dark and light theme (:warning: Requires 13.0.41 and above)
(Thanks to Leo for providing the example xml file)

FLUENT_UI.dis (1.3 MB)

Fluent UI Dual Tone Icon Set:

(Update 14-Nov-2024)
--Some of the line strokes are not aligned properly.

FLUENT_UI_DUALTONE.dis (1.3 MB)

Fluent UI26 Thin Line Icon Set:

NOTE: This icon set was created at 26 pixels not at 32 pixels. Large icons at 26 px (pixel perfect) and small icons at 22 px (pixel perfect). I attached in the dis file several sizes (22px, 26px, 32px, 48px, 64px) in case you want to change the size of the icon in the xml file.

(Update 14-Nov-2024)
--Some of the line strokes are not aligned properly.

FLUENT_UI26_THIN.dis (1.6 MB)

Fluent UI26 Thin Line Dual Tone:

(Update 14-Nov-2024)
--First release.

FLUENT_UI26_THIN_DUALTONE.dis (1.6 MB)

I hope you like it... :slightly_smiling_face:

33 Likes

Nice icons, Installs instantly. Thanks! :smile:

1 Like

Very nice, thanks for sharing!

1 Like

I like it, thank you very much!

1 Like

Great icons!

I took the liberty of making a version Fluent UI which works with both light and dark modes, since we didn't have any examples of how to do that yet.

It turned out it required some changes on our side, which are in the beta we just put out.

It's up to you if you want to change the original/definitive set to work the same way. It does make startup a bit slower, as there are more icons to load, but only a fraction of a second.

6 Likes

Many thanks.

1 Like

@skinz the monotone are really something. Many thanks!
If you have time to spare, could you consider making a variation where the small icons are slightly larger (e.g. 25px or 26px)?

Here, I made a small icon with a size of 26 pixels.

FLUENT_UI_CUSTOM.dis (1.3 MB)

This is the difference between 22 pixels and 26 pixels:

Hopefully it's as you expected... :slightly_smiling_face:

5 Likes

@skinz many thanks!

1 Like

Hi @skins this is an excellent icon pack

was wondering would it be possible to fix the "Go Forward" and "Go Back" icons to be consistent with the other icons (they are light grey which is very low contrast in light mode, but looks perfect in dark mode)

I don't use them, but there are a couple of other icons with this problem too: Favorites, Home, and Refresh

Hi, thank you for your nice words.
I just adjusted the color of the icons to the default dopus icon color.

If I change the icon color to black, the result will not be balanced with the default dopus icon. All the icons you mentioned are only for the File Display bar except the favorites icon.

2023-11-23_173246

Updated the first post and added a new icon set "FLUENT_UI_DUALTONE".

3 Likes

Updated the first post and added a new icon set "FLUENT_UI26_THIN". Made at a size of 26 pixels with a stroke thickness of 1 pixel (thin line).

1 Like

Impressive! What tools do you use to create these sets?

1 Like

I used Affinity Designer to create all the icons.

Awesome!

many thanks.

1 Like

Updated the first post and added small icons (22 px) in pixel perfect.

Merry Christmas to those who celebrate and happy New Year 2024... :slightly_smiling_face:

5 Likes

Updated the first post (03-01-2024). Fixed some sub-icon colors not displaying correctly for dual tone color icon sets, and fixed some missing icon elements.

2024-01-03_151455

7 Likes

OOOH these are nice! Thank you!

1 Like

I love this icon set. I would love to be able to create my own icons in the same style for custom buttons but I have real trouble getting them pixel perfect the way you have done (I have Illustrator and PS). Even when the exported .png looks clean it gets slightly altered (e.g. aliasing on the straight edges) when assigning the image to a button in Dopus.