Select “Upload an image” (and upload your custom icon) or “Link” (and paste the icon link).Click the “add icon” button when hovering over the top of your Notion page.→ Check out Iconfinder free icons Notion Icons FAQ How to add icons to Notion Just click the “Copy Base64 SVG” to copy the icon data link. If you find the icon you want to use, you don’t have to download it. Here you can find all different kinds of icons: from minimalist, to hand-drawn and very detailed ones. Here is another large library with over 235,000 free icons. They give an aesthetic style to your Notion pages while keeping the simplicity of use. Minimalist icons have simple designs which make them work seamlessly within your Notion pages.Ĭhoosing to use minimalist Notion icons allows you to have clean and easy to navigate workspaces. → Check out Icones.js.org Minimalist Notion Icons Now you can upload the icon into your Notion page. Or click Download > SVG to download the icon.Now you can paste the link into your Notion page. Make sure you have the “copy with color” checkbox checked. Click the icon in the bottom left corner to open the color settings.Click the desired icon to open icon settings.Use the search button in the upper left corner to search through all icons.This library unifies most of the existing icon packs on the internet. You’ll find everything you need here with icon sets for emojis, brand logos, numbers, letters, symbols and much more. This can be often used inside form elements to disable the submit button before all the form elements have been completed and validated.This is the most complete library for your Notion pages, with more than 130,000 free icons available. Use the following styles to indicate a disabled button. Use the following spinner components from Flowbite to indicate a loader animation inside buttons: Icon description Icon description Icon description Icon description Expand code Loader This example can be used to show a notification count or helper text inside a button using the badge element. Use the following examples to add a SVG icon inside the button either on the left or right side. Use these examples if you want to use smaller or larger buttons.Įxtra small Small Base Large Extra large Expand code Button sizes with icon Use the following button styles to show the colors only for the border of the element.ĭefault Dark Green Red Yellow Purple Expand code Button sizes Purple to Blue Cyan to Blue Green to Blue Purple to Pink Pink to Orange Teal to Lime Red to Yellow Expand code

The button pills can be used as an alternative style by using fully rounded edges.ĭefault Alternative Dark Light Green Red Yellow Purple Expand codeīlue Green Cyan Teal Lime Red Pink Purple Expand code Default Alternative Dark Light Green Red Yellow Purple Expand code Button pills

Cool icons transparent