How to change the color of ttk button

Question

I am using Python 3.x on Windows.

My problem is I want to customize a button widget of ttk by completely changing its background and foreground color. But so far, I have been unsuccessful.

My desired button is:

enter image description here

I read the ttk.Style guide and used their code:

ttk.Style().configure("TButton", padding=6, relief="flat",
   background="#000")

btn = ttk.Button(text="Sample")
btn.pack()

But it's changing the border color instead of the whole button bakground. Here is the output:

enter image description here

Kindly help me achieve my desired button.

Does this answer your question? [tkinter ttk widgets ignoring background color?](https://stackoverflow.com/questions/23750141/tkinter-ttk-widgets-ignoring-background-color) — SEDaradji, Apr 06 '20 at 19:04

score 22 · Answer 1 · edited Mar 02 '20 at 13:13

Although it is not as simple as with Tk buttons, it is possible. In ttk, if you set the theme_use attribute to any of these: ('winnative', 'clam', 'alt', 'default', 'classic', 'vista', 'xpnative'), you should be able to modify the default behaviour. I set the "style.map" attribute to avoid background colour change due to mouse hover (The state of the button is always 'active').

import tkinter as tk
from tkinter import ttk 

style = ttk.Style()
style.theme_use('alt')
style.configure('TButton', background = 'red', foreground = 'white', width = 20, borderwidth=1, focusthickness=3, focuscolor='none')
style.map('TButton', background=[('active','red')])

root = tk.Tk()
button = ttk.Button(root,text='Quit')
button.place(relx=0.3,rely=0.4)  
root.mainloop()

Hope this helps.

score 20 · Accepted Answer · 2014-12-07T22:02:10.417

20

Unfortunately, there isn't an easy way to change the foreground of a button from the ttk library. It is always the standard Windows gray like in your picture.

But you can easily get what you want with a normal tkinter.Button if you set the right options. Below is an example script:

import tkinter as tk

root = tk.Tk()
btn = tk.Button(root, 
                bg='#000000',
                fg='#b7f731',
                relief='flat',
                text='hello button',
                width=20)
btn.pack()

root.mainloop()

And here is what it will look like:

enter image description here

Also, the shade of green I picked was just an example one that I thought was pretty close to what you wanted. But you can specify any hex color code you want. If you need to turn a RGB value into hex, a simple trick is to use str.format like so:

>>> rgb = (183, 247, 49)
>>> '#{:02x}{:02x}{:02x}'.format(*rgb)
'#b7f731'
>>>

edited Dec 07 '14 at 22:02

answered Dec 07 '14 at 21:33

1

Thank you so much it worked but is there any example with ttk ?? – maq Dec 08 '14 at 03:49
i want to do it with ttk @iCodez – maq Dec 08 '14 at 13:44
I'm not sure that is possible (I could be wrong though). `ttk.Button` is a special kind of button that is designed to be identical to the standard Windows button. If you want a different look, then there is really no reason to use the `ttk.Button`. The normal Tkinter button does what you want just fine. – Dec 08 '14 at 15:04
1

Otherwise, you have about three options: 1) use a different GUI toolkit besides Tkinter. This could be either wxpython or Qt. 2) create an image of the button you want and use that instead, or 3) alter the `ttk` source code to use a different look. Other than that, your best bet is to use the normal `tkinter.Button`. – Dec 08 '14 at 15:05

victorkolis · Answer 3 · 2022-11-12T23:30:18.763

CONTEXT: Debian based computers

SHORT EXAMPLE:

from tkinter import ttk
from tkinter import Tk

root = Tk()
style = ttk.Style()
button_1 = ttk.Button(root, text='click me')
style.theme_use('alt')
style.configure('TButton', font=('American typewriter', 14), background='#232323', foreground='white')
style.map('TButton', background=[('active', '#ff0000')])
button_1.pack()

root.mainloop()

LONG EXAMPLE:


from tkinter import *
from tkinter import ttk


class App:
    def __init__(self):

        # Window setup
        self.root = Tk()
        self.root.title('BUTTONS')
        WIDTH, HEIGHT = 300, 500
        INITIAL_X_POSITION, INITIAL_Y_POSITION = 450, 200
        self.root.geometry(f'{WIDTH}x{HEIGHT}+{INITIAL_X_POSITION}+{INITIAL_Y_POSITION}')
        self.root.resizable(False, False)
        self.style = ttk.Style()

        # Layout
        self.button_1 = ttk.Button(self.root, text='click me', command=self.show_me_pi)
        self.style.theme_use('alt')
        self.style.configure('TButton', font=('American typewriter', 14), background='#232323', foreground='white')
        self.style.map('TButton',
                       background=[('active', '#ff0000'), ('disabled', '#f0f0f0')]

                       )
        self.button_1.pack()

        self.button_2 = ttk.Button(self.root, text='click me', state='disabled')
        self.button_2.pack()
        self.root.mainloop()

    def show_me_pi(self):
        py_label = Label(self.root, text='3.14159', font=('American typewriter', 20))
        py_label.pack()


app_runner = App()

MacOSX is not so compatible with Tkinter colors so simply changing the color the way you would on a Windows-based machine is prone to fail. So following the code above is a way around that incompatibility. In addition, here is an awesome webpage that covers this Tkinter properties matter in detail: https://anzeljg.github.io/rin2/book2/2405/docs/tkinter/button.html — victorkolis, Apr 11 '21 at 01:05
As of 2022, this seems to be the only answer that works (with Python3 on Ubuntu). — dominecf, Jan 23 '22 at 12:18
is there any way to make it a particular color without having to hover over it? — Dekriel, Feb 04 '22 at 13:22
@Dekriel , yup, the `background='#232323'` in this code is giving the button a dark grayish tinge. So you might use that tag to change it to a particular color of your choice. Peace out. — victorkolis, Feb 05 '22 at 21:06

score 2 · Answer 4 · answered Jul 19 '17 at 15:08

2

import ttk

root.style = ttk.Style()
#root.style.theme_use("clam")
style.configure('TButton', background='black')
style.configure('TButton', foreground='green')
button= ttk.Button(self, text="My background is black and my foreground is green.")

works for me if you want to change all your buttons to the one you "desire", with Python 2.7 and Tkinter 8.6

answered Jul 19 '17 at 15:08

Soltius

2,162
1
16
28

7

This seems to be the same as what the OP did themselves. – Artemis Sep 23 '18 at 13:48

score 0 · Answer 5 · answered Apr 12 '23 at 12:49

I had the same problem and found the key is to change the name of the style you're applying to the button from Custom.TButton to Custom.TLabel. For example:

style = ttk.Style()
ttk.Style().configure("Custom.TLabel", padding=6, relief="flat",
   background="#000")

btn = ttk.Button(text="Sample", style="Custom.TLabel")
btn.pack()

Or a full program:

from tkinter import ttk

root = tk.Tk()

style = ttk.Style()
style.configure('Custom.TLabel', background='red')

slider = ttk.Button(root, text="Hello World", style='Custom.TLabel')
slider.pack(pady=20)

root.mainloop()

Siddartha Reddy · Answer 6 · 2021-04-30T17:51:36.147

-5

import tkinter as tk

btn = tk.fButton(text="Sample", bg = "red") #Refer line 2625 in tkinter code
btn.pack()

For more go to Tkinter code, go to line number 2625.
Here, you will find the solution to the question.

i used here tk.fButton because in version of tkinter it doesen't support tk.Button, if u are getting error with tk.fButton then use tk.Button left everthing will remain same

edited Apr 30 '21 at 17:51

answered Apr 27 '21 at 11:01

Siddartha Reddy

19
3

1

What is `tk.fButton`. – Delrius Euphoria Apr 27 '21 at 12:42
It is same as `tk.Button` there is absolutely no difference, its same. But i guess after update it is changed. you can see **line 2625** of **init** file. – Siddartha Reddy Apr 28 '21 at 13:53
Line 2625, shows the `Button` class. Not the `fButton`. Please do proper research before posting an answer. – Delrius Euphoria Apr 28 '21 at 15:18
@CoolCloud one run `pip uninstall tkinter` then `pip install tkinter` or just update tkinter module then go to **__init__** file and then head over to line 2625 there u will find the **fButton**. Maybe you are not using the latest version – Siddartha Reddy Apr 29 '21 at 16:58
You cannot install `tkinter` with `pip`. It comes standard with python – Delrius Euphoria Apr 29 '21 at 16:59
@CoolCloud can i get your email, I can send u the screenshots there here i can't upload any images – Siddartha Reddy Apr 29 '21 at 17:01
@CoolCloud [Click here for more informatation](https://pypi.org/project/tkintertable/) – Siddartha Reddy Apr 29 '21 at 17:03
How is `tkintertable` same as `tkinter`. You can upload images in your answer. – Delrius Euphoria Apr 29 '21 at 17:20
@CoolCloud Now I think u didn't do any research. To download tkinnter u cant run `pip install tkinter` u need to run `pip install tkintertable`. so just once reinstall it and see line 2625 and if u are using older version and want to continue using it run then same code with `tk.Button` instead of `tk.fButton`. *and u can't upload any images atleast i am getting any option – Siddartha Reddy Apr 30 '21 at 17:48
4

[The ``tkinter`` module ships with Python itself](https://docs.python.org/3/library/tkinter.html). It is not installed via ``pip``. The linked to pypi page is for the ``tkintertable`` module, not ``tkinter``. – MisterMiyagi Apr 30 '21 at 19:36
4

[The most recent ``tkinter`` only defines ``Button``, not ``fButton``](https://github.com/python/cpython/blob/6143fcdf8bfe54c24e3081bcee423f4d51f35c4e/Lib/tkinter/__init__.py#L2652). – MisterMiyagi Apr 30 '21 at 19:39

How to change the color of ttk button

6 Answers6

Linked