How to remove Ttk Notebook Tab Dashed Line? (tkinter)

When working with Tkinter's ttk.Notebook widget, you may notice a dashed rectangular outline that appears around the selected tab when clicked. This focus indicator can be visually distracting and can be removed using ttk.Style configuration.

Understanding the Dashed Line Issue

The dashed line appears as a focus indicator when a tab is selected. This is the default behavior of ttk themed widgets, but it can be customized or removed entirely using the focuscolor property.

Solution: Removing the Dashed Line

To remove the dashed line, we need to configure the ttk style by setting the focuscolor to match the background color ?

# Import the required library
from tkinter import *
from tkinter import ttk

# Create an instance of tkinter frame
win = Tk()
win.geometry("700x350")

# Create an instance of ttk style
style = ttk.Style()

# Define Style for Notebook widget
style.layout("Tab", [('Notebook.tab', {'sticky': 'nswe', 'children':
    [('Notebook.padding', {'side': 'top', 'sticky': 'nswe', 'children':
        [('Notebook.label', {'side': 'top', 'sticky': ''})],
    })],
})]
)

# Use the Defined Style to remove the dashed line from Tabs
style.configure("Tab", focuscolor=style.configure(".") ["background"])

# Create a Notebook widget
my_notebook = ttk.Notebook(win)
my_notebook.pack(expand=1, fill=BOTH)

# Creating Tabs
tab1 = ttk.Frame(my_notebook)
my_notebook.add(tab1, text="Tab 1")
tab2 = ttk.Frame(my_notebook)
my_notebook.add(tab2, text="Tab 2")

# Create Labels in Tabs
Label(tab1, text="Hello, Howdy?", font=('Helvetica', 20, 'bold')).pack(pady=20)
Label(tab2, text="This is a New Tab Context", font=('Helvetica', 20, 'bold')).pack(pady=20)

win.mainloop()

How It Works

The key line that removes the dashed line is:

style.configure("Tab", focuscolor=style.configure(".") ["background"])

This sets the focuscolor of the Tab style to match the default background color, making the focus indicator invisible.

Alternative Approach

You can also set a specific color for the focus indicator ?

from tkinter import *
from tkinter import ttk

win = Tk()
win.geometry("700x350")

style = ttk.Style()

# Set focuscolor to white or any specific color
style.configure("TNotebook.Tab", focuscolor="white")

my_notebook = ttk.Notebook(win)
my_notebook.pack(expand=1, fill=BOTH)

tab1 = ttk.Frame(my_notebook)
my_notebook.add(tab1, text="Tab 1")
tab2 = ttk.Frame(my_notebook)  
my_notebook.add(tab2, text="Tab 2")

Label(tab1, text="No Dashed Lines!", font=('Arial', 16)).pack(pady=50)
Label(tab2, text="Clean Tab Interface", font=('Arial', 16)).pack(pady=50)

win.mainloop()

Key Points

• The focuscolor property controls the appearance of the focus indicator
• Setting it to match the background makes the dashed line invisible
• You can use either a custom layout or the simpler TNotebook.Tab style approach
• The focus functionality remains intact ? only the visual indicator is removed

Conclusion

Removing the dashed line from ttk Notebook tabs improves the visual appearance of your GUI. Use focuscolor configuration to match the background color for a clean, professional look.