# Top Pages Questions

**URL:** <https://forums.realmacsoftware.com/t/top-pages-questions/47863>\
**Category:** Elements\
**Created:** [June 1, 2025, 2:21pm UTC](https://forums.realmacsoftware.com/t/top-pages-questions/47863 "2025-06-01T14:21:09Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![bruce](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/bruce/32/23155_2.png) [@bruce](https://forums.realmacsoftware.com/u/bruce)\
**Post date:** [June 1, 2025, 2:21pm UTC](https://forums.realmacsoftware.com/t/top-pages-questions/47863/1 "2025-06-01T14:21:09Z")

</div>

Where is the setting to change the color of the page names on hover? I see Dan has done that in the Dev Diary video. Also, how do I make the SVG icon match the color of the text in the top menu default, hover, and active?

---

<div class="post-metadata">

**Author:** ![upssjw](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/upssjw/32/26063_2.png) [@upssjw](https://forums.realmacsoftware.com/u/upssjw)\
**Post date:** [June 1, 2025, 4:14pm UTC](https://forums.realmacsoftware.com/t/top-pages-questions/47863/2 "2025-06-01T16:14:46Z")

</div>

Default & Active ? near the bottom of the Pages controls?, the Default is the Hover color , the Active state then changes color on Hover using the Default state? I think from memory  
Do not think there is a seperate option for alternative Hover color, would be nice, might be wrong though not at laptop at moment

svg discussed here in Top Pages

> [@Top Pages Feature](https://forums.realmacsoftware.com/t/top-pages-feature/47757):
>
> The Top Pages component is incredibly handy, but there is one missing feature and that is the ability to either specify colors for an icon, if they are turned on, or at the very least have the icon use the same colors as those set for the title. The way it is now if you have a dark background and your text is WHITE the icons are shown in BLACK, plus they do not change color when the title changes color. This seems like a deficiency to me as I cannot see any way around it, other than to ensure …

---

<div class="post-metadata">

**Author:** ![bruce](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/bruce/32/23155_2.png) [@bruce](https://forums.realmacsoftware.com/u/bruce)\
**Post date:** [June 1, 2025, 6:42pm UTC](https://forums.realmacsoftware.com/t/top-pages-questions/47863/3 "2025-06-01T18:42:47Z")

</div>

That works but it is not what I see in the video. In the Dev Diary 76 Dan shows hover where the SVG icon changes color too.

 ![Screenshot 2025-06-01 at 1.42.25 PM](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/b/4/b4898430c1ced4f77c6bf4b2c8421b86d39d0a1e.png)

---

<div class="post-metadata">

**Author:** ![upssjw](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/upssjw/32/26063_2.png) [@upssjw](https://forums.realmacsoftware.com/u/upssjw)\
**Post date:** [June 1, 2025, 6:44pm UTC](https://forums.realmacsoftware.com/t/top-pages-questions/47863/4 "2025-06-01T18:44:17Z")

</div>

did you read the link to the post re the svg

An SVG page icon will be set to same colour as the text — so long as your SVG icon is correctly formatted.

---

<div class="post-metadata">

**Author:** ![bruce](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/bruce/32/23155_2.png) [@bruce](https://forums.realmacsoftware.com/u/bruce)\
**Post date:** [June 2, 2025, 12:07am UTC](https://forums.realmacsoftware.com/t/top-pages-questions/47863/5 "2025-06-02T00:07:14Z")

</div>

Thanks @upssjw I did read it. I have no idea where I would add that info, and the reason I buy and use [Elements](https://elementsapp.io/) is so I don’t have to do that. Maybe someone can direct me to SVGs that have that color info embedded.

---

<div class="post-metadata">

**Author:** ![bruce](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/bruce/32/23155_2.png) [@bruce](https://forums.realmacsoftware.com/u/bruce)\
**Post date:** [June 2, 2025, 1:02am UTC](https://forums.realmacsoftware.com/t/top-pages-questions/47863/6 "2025-06-02T01:02:52Z")

</div>

I found SVG font online that have the outline color set to stroke =“currentColor” and they work.

> **[Tabler Icons: 5900+ free vector icons for web design](https://tabler.io/icons)**
>
> Tabler Icons: 5925 free and open source SVG icons. Customizable size, color and stroke. Available for React, SolidJS, Vue, Figma and more for free!

---

<div class="post-metadata">

**Author:** ![handshaper](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/handshaper/32/27373_2.png) [@handshaper](https://forums.realmacsoftware.com/u/handshaper)\
**Post date:** [June 2, 2025, 2:01am UTC](https://forums.realmacsoftware.com/t/top-pages-questions/47863/7 "2025-06-02T02:01:44Z")

</div>

Yes, that is the key you want either the fill or stroke color to be set to `currentColor` then [Elements](https://elementsapp.io/) will pick it up and apply the appropriate color.

I now edit all of my SVG icons to have the following info at the beginning.

```auto
<svg 
	viewBox="0 0 24 24"	
	xmlns="http://www.w3.org/2000/svg" 
	fill="currentColor" 
	fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" clip-rule="evenodd"
>

```
