# Tab strip design

**URL:** <https://forum.inductiveautomation.com/t/tab-strip-design/36235>\
**Category:** Ignition\
**Tags:** ignition80, vision\
**Created:** [July 1, 2020, 7:15am UTC](https://forum.inductiveautomation.com/t/tab-strip-design/36235 "2020-07-01T07:15:42Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![ott.sellis](https://avatars.discourse-cdn.com/v4/letter/o/bbce88/32.png) [@ott.sellis](https://forum.inductiveautomation.com/u/ott.sellis)\
**Post date:** [July 1, 2020, 7:15am UTC](https://forum.inductiveautomation.com/t/tab-strip-design/36235/1 "2020-07-01T07:15:42Z")

</div>

Hello

I would like to create a tab strip similar to Google Chrome’s design.

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/f/bf6540cfad24c7f57abc51c7fc18f8ba92b22e16.png)

Where the edges of the tab are straight, but the corners are rounded.

The closest I was able to get was by using a folder structure, but I was unable to straighten the edges and the edges become pixelated. Is there a way to round the corners with the fancy design or to straighten the edges with the folder design?

My currently used tab strip:

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/d/adeee335dc1b224ba345fb8db2153ee8a4c9e4e4.png)

---

<div class="post-metadata">

**Author:** ![KMuldoon](https://avatars.discourse-cdn.com/v4/letter/k/839c29/32.png) [@KMuldoon](https://forum.inductiveautomation.com/u/KMuldoon)\
**Post date:** [July 1, 2020, 8:01am UTC](https://forum.inductiveautomation.com/t/tab-strip-design/36235/2 "2020-07-01T08:01:10Z")

</div>

I’ve been working on some navigation myself and even though it’s not an exact match to Chrome, you might be able to take some inspiration from what I have and make it work for your needs.

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/b/8b0b87151423fe576503612eaaaaa53f29bb22a0.png)

(Note: I have navigation disabled since I’m doing additional scripting when navigating)

---

<div class="post-metadata">

**Author:** ![ott.sellis](https://avatars.discourse-cdn.com/v4/letter/o/bbce88/32.png) [@ott.sellis](https://forum.inductiveautomation.com/u/ott.sellis)\
**Post date:** [July 3, 2020, 5:31am UTC](https://forum.inductiveautomation.com/t/tab-strip-design/36235/3 "2020-07-03T05:31:13Z")

</div>

Oh wow, thank you @KMuldoon! This will work just fine.
