Style Your Python GUI with Tkinter – Fonts, Colors & TTK Themes

← Back to Home

 

🐍 Python UI Programming Series — Part 3: Styling Your UI with Tkinter


📘 Overview

In Part 1 and 2, you learned how to create GUI windows and organize widgets using layout managers. Now, let’s give your app some style and make it visually appealing.

In this part, we’ll cover:

  • Setting fonts and colors

  • Customizing buttons and labels

  • Using themes with ttk

  • A styled form example


🎨 Why Styling Matters

An intuitive and attractive UI:

  • Improves user experience

  • Enhances usability

  • Makes your app feel polished and professional

Tkinter allows basic styling through widget options and more advanced styling with the ttk module.


🖌️ Basic Styling with Tkinter Widgets

✅ Set Font and Color

import tkinter as tk

root = tk.Tk()
root.title("Styled Widgets")

label = tk.Label(root, text="Welcome!", font=("Arial", 16, "bold"), fg="white", bg="blue")
label.pack(pady=10)

button = tk.Button(root, text="Click Me", font=("Verdana", 12), bg="#4CAF50", fg="white")
button.pack(pady=10)

root.mainloop()

🔎 Key Style Options:

  • font: (family, size, style) like ("Helvetica", 12, "italic")

  • bg: background color

  • fg: text color

  • relief: button border style (flat, raised, sunken, ridge)


💼 Using ttk for Themes and Consistency

The ttk (Themed Tkinter) module provides modern-looking widgets with built-in themes.

import tkinter as tk
from tkinter import ttk

root = tk.Tk()
root.title("Using TTK")

ttk.Style().theme_use("clam")  # Try: 'alt', 'default', 'classic', 'clam'

label = ttk.Label(root, text="Enter your name:")
label.pack(pady=5)

entry = ttk.Entry(root)
entry.pack(pady=5)

button = ttk.Button(root, text="Submit")
button.pack(pady=5)

root.mainloop()

ttk improves:

  • Visual consistency across platforms

  • More modern default styles

  • Better alignment and padding


🧠 Tip: Change TTK Widget Style

You can create custom styles for buttons or labels:

style = ttk.Style()
style.configure("TButton", foreground="white", background="#007ACC", font=("Segoe UI", 10, "bold"))

Apply it to your ttk.Button — it will inherit the new look.


📋 Example: Styled Login Form

import tkinter as tk
from tkinter import ttk

def login():
    user = entry_user.get()
    result_label.config(text=f"Welcome, {user}!")

root = tk.Tk()
root.title("Styled Login")
root.geometry("300x200")

style = ttk.Style()
style.theme_use("clam")
style.configure("TButton", padding=6, relief="flat", background="#4CAF50", foreground="white")
style.configure("TLabel", font=("Arial", 10))
style.configure("TEntry", padding=4)

ttk.Label(root, text="Username:").pack(pady=5)
entry_user = ttk.Entry(root)
entry_user.pack(pady=5)

ttk.Button(root, text="Login", command=login).pack(pady=10)

result_label = ttk.Label(root, text="")
result_label.pack(pady=10)

root.mainloop()

👀 Simple, styled, and responsive!


💡 Recap

In this part, you learned:

  • How to style basic widgets with fonts, colors, and reliefs

  • How to use ttk for modern themes

  • How to create a clean, styled form


🚀 Coming Up in Part 4:

"Building a Multi-Page UI in Tkinter"

  • Learn to navigate between multiple windows or frames

  • Build a real-world application structure (e.g., dashboard, form wizard)


No comments:

Post a Comment

Featured Post

Add Keyboard Shortcuts to Tkinter GUI – Python Hotkeys with Bind Examples

  ← Back to Home ⌨️ Bonus Part 5: Keyboard Shortcuts & Hotkeys in Tkinter – Boost App Productivity 📘 Overview Keyboard shortcuts ...

Popular Posts