Search the Community

Material Design icons (filled theme) Last update : September 15, 2019 About This afassets file contain all the icons of the filled theme extracted (manually) from the Material Design Icons Website. All the icons are vector based with a bounding box of 24dp. Getting started Open the assets pannel (View > Studio > Assets). Click Panel Preferences (top right of the assets pannel window) and select Import Assets. Locate the file Material_Design_Icons_Filled.afassets and click Open. Layers structure Icon (Bounding box) Icon__Shape (Icon) For changing the icon default color, select the shape layer. Readability You can change the appearance of the assets in the pannel for a better readability : Open the assets pannel (View > Studio > Assets). Click Panel Preferences and select Show as list. Sources Material_Design_Icons_Website Material_Design_Icons_Filled.afassets

Hi I just made the switch to Affinity and I have to say other than the lack of Image Tracing I am loving it. I immediately fell for the Asset panel and started looking for Icons. I found this post from a few of years ago: https://forum.affinity.serif.com/index.php?/topic/29075-icon-pack/ I like the packs, albeit a little out of date in 2021. However, I didn't like that they were all split into multiple files and that you can't merge categories. I decided I wanted to remake the pack, but I had no desire to painstakingly go through and name each SVG. So I created an application that reads individual SVG icons and merges them to a single file. I provide a colour change option so you can pick colours best suited for both Dark and Light themes. Due to how this application works it will only work on Icon and will not convert complex multi-path SVGs. Here is the application https://gcoulby.github.io/affinity-sprite-sheet-generator/index.html and here is a link to the repository (including basic documentation https://github.com/gcoulby/affinity-sprite-sheet-generator) I have also included the asset pack which contains the same set of Icons (sans Gnome icons, which no longer exist) posted by @helmuthdu but they are contained into a single asset with subcategories Entypo+: https://github.com/chancancode/entypo-plus FontAwesome: http://fontawesome.io/ Foundation: https://github.com/zurb/foundation-icon-fonts Game Icons: http://game-icons.net Hawcons: http://hawcons.com/ Icomoon: https://icomoon.io/icons-icomoon.html Ionic Icons: https://github.com/driftyco/ionicons Material Design Icons: https://materialdesignicons.com Material Icons: https://github.com/google/material-design-icons Typicons: http://www.typicons.com/ icon_pack.afassets

Here is a collection of assets created from the material design sticker sheet obtained here: https://material.google.com/resources/sticker-sheets-icons.html Could use a little more work, but I've added constraints to the lists, UI bars, and tabs. Most of the shadows are currently bitmaps. I had issues with some text boxes becoming the wrong size when the group was turned into an asset, so artistic text is used in some places where a text frame would be more appropriate. I couldn't find a license anywhere for the sticker sheet, so feel free to modify and share or use however you want, however, please don't redistribute as an asset pack while charging a price (sharing for free is fine). If you want to share any changes/improvements, I'd appreciate it if you posted them to this thread. An example I quickly made with some of the assets is below. material_assets.zip

Hi, This logo was made following the Material Design Product icon Rules. If you want a little guide that show you how i made this logo with Affinity Designer, just tell me and i will post it in the tutorial section of this forum.

Material Design color palette Last update : September 7, 2019 Version : 1.0.0 About This afpalette file contain all the main colors and variants of the Material Design color palette extracted (manually) from the Material Design Color Tool Website. Getting started Open the swatches pannel (View > Studio > Swatches). Click Panel Preferences (top right of the swatches pannel window) and select a palette type from the Import Palette sub-menu. Locate the file Material_Design_Colors.afpalette and click Open. The newly imported palette will now be available to choose in the palette pop-up menu. Missing variants Some variants are missing : All colors 50 light variants are white (#FFFFFF). Red, Grey and blue grey 100 light variants are white (#FFFFFF). Grey 900 dark variant is black (#000000). Text color swatches For texts on a light color background : Black - Disabled (#000000 38%) Black - Medium (#000000 60%) Black - High (#000000 87%) For texts on a dark color background : White - Disabled (#FFFFFF 38%) White - Medium (#FFFFFF 60%) White - High (#FFFFFF 87%) Readability You can change the appearance of the swatches in the pannel for a better readability : Open the swatches pannel (View > Studio > Swatches). Click Panel Preferences and select Show as list from the Appearance sub-menu. Click Panel Preferences and select Alphabetical from the Sort sub-menu. Sources Material Design Color Tool Material_Design_Colors.afpalette

Hello all! I'm trying to make shadows that follow Google's Material Design (Like in the lightning logo attached). I know to make a curve with a darker color, but I cant get it to snap perfectly- with the same diagonals, etc. Another picture below is something I'm trying to make, but as you might be able to see, the diagonals from the bottom part of the plus and the top part are not the same. Let me know. Thanks!

Hi, I've been working on som assets and documents for material design in Affinity designer. The Icon assets are the original SVG downloaded from https://material.io/icons/ and are all in 24x24 px (I will try to update this when there is new icons). I've also started to make a document that is a copy of te dokument that Sketch uses (This is not done but I would like feedback on what to improve) Material design.zip

Hi Everyone, I have created a color palette based on Google's material design (https://material.io/guidelines/style/color.html). Attaching the palette file for AD. Hope it would help. Regards, Anupam Bordoloi Material Design Palette.afpalette

I can't find Glyphs in Affinity Design, for using font icon. Can you help me?

Hi, I am going to make a set of Icons in the material design style, Has anyone got any tips on what size i should make my document, and what grid i should use etc? i took a look at googles guidlines here and underneath is a snippet, how do i create an edge of 1dp? DP unit gridAndroid expects product icons to be provided at 48dp, with edges at 1dp. When you create the icon, maintain the 48-unit measure, but scale it to 400% at 192 x 192 dp (the edge becomes 4dp).

What do ya'll think of my attempt at making a flat version of my profile pic? Does it portray a crocodile with sunglasses and pony ears?