Skip to content

component

TextThemeToggle

By Harsh Works

Details

Summary

TextThemeToggle is a clean, minimal theme switcher component for Framer that uses text-based buttons to toggle between Light and Dark modes.

Description

TextThemeToggle is a clean, minimal theme switcher component for Framer that uses text-based buttons to toggle between Light and Dark modes. It’s designed for designers who want subtle, flexible theme switching without visual clutter or custom code. The component gives you full control over labels, typography, colors, spacing, corner radius, hover scale, and transition timing directly from the properties panel. You can choose between horizontal or vertical layouts, adjust alignment, and optionally show a separator between buttons. TextThemeToggle works seamlessly with Framer’s theme system and adapts easily to different layouts and breakpoints, making it ideal for headers, navigation bars, and UI controls in modern websites. Features Text-based Light / Dark theme toggle Custom labels for each theme Full typography control Customizable active & inactive colors Adjustable padding, gap, and radius Hover scale interaction with smooth transitions Optional separator between buttons Horizontal or vertical layout support No-code setup inside Framer Responsive and breakpoint-friendly Property Controls

Introduction

Text-based light & dark toggle

Rank history

Daily rank per list, from the first snapshot — lower is better.

120014001600160498/148/228/309/79/15
  • All · #4088