---
title: "Today's Hours Chip — Framer component · Best of Framer"
description: "$8.00 · Framer component · by Joshua Reddekopp · Text. Show your visitors whether you're open or closed today — automatically."
canonical: "https://framer.elliotli.dev/component/today-s-hours-chip"
---

[Home](/)/[Components](/components)/[Text](/components/category/text)/Today's Hours Chip

# Today's Hours Chip

[View on Framer](https://framer.com/marketplace/components/today-s-hours-chip/?via=elliot-li)

![Today's Hours Chip preview image 1](https://framer.elliotli.dev/og/component/today-s-hours-chip/351631b4824d6987/1600x1200.jpg)

## Summary

Show your visitors whether you're open or closed today — automatically.

## Description

Show your visitors whether you're open or closed today — automatically.

The Today Hours Chip intelligently displays today's hours based on the business time-zone, holidays, and even long weekend rules. Perfect for small businesses, clinics, studios, or any service-based website.

## Key Features

**Smart “Today” Logic**Displays today’s hours based on your selected business time zone — not the visitor’s.

**Daylight Savings Time Support**Time is weird sometimes - toggle on/off DST to dial it in.

**Custom Hours Per Day**Set specific open/close times for each day, or mark days as closed entirely.

**Holiday Recognition**Add fixed-date holidays in a simple format like 12-25:Christmas Day.

**Easter Support**Enable automatic yearly recognition of Easter + Good Friday with a single toggle.

**Long Weekend Handling**Optionally close Saturdays or Sundays when a holiday falls on the Friday or Monday.

**Fully Customizable Style**Adjust fonts, sizes, weights, colors, borders, and shapes (pill, rounded, square) to match your brand.

## How to Use

1.  **Drag the component into your canvas.**
    
2.  **Set your business time zone.**This controls how “today” is calculated — it does **not** adapt to the viewer’s location.
    
3.  **Set hours for each day.**Toggle each day open/closed, and set open/close times using 12-hour formatting like 8:30am.
    
4.  **Add holidays.**Use the “Holidays” text field — one per line: 12-25:Christmas Day
    
5.  **Enable Easter or Long Weekends**Optional toggles if your business observes them.
    
6.  **Customize appearance.**Tweak font, size, color, borders, and shape to suit your brand.
    

## When Should I Use This?

Use this chip to show up-to-date business hours anywhere on your site — homepage, contact page, or header. Especially useful for:

-   Clinics & wellness centers
    
-   Coffee shops & restaurants
    
-   Service providers
    
-   Local businesses
    

## Pro Tips

-   Pair it with a calendar or contact block for a polished, professional UX.
    
-   Text automatically changes to “Closed Today – Holiday Name” if today is a listed holiday.
    

## Rank history [How rankings work →](/terms#rankings)

-   All · #10797

## Details

- **Author**: Joshua Reddekopp
- **Price**: $8.00
- **Published**: 2025-08-25
- **Updated**: 2025-08-25
- **Added**: 2025-08-04
- **Categories**: Text

## More like this

-   [Hover Stretch Text](/component/hover-stretch-text) — 584.studio · $3 — Responsive & fully customizable
-   [Type Write Effect](/component/type-write-effect) — Russet Supply · Free — Animated Text & Interactive Typing
-   [Odometer Stats](/component/odometer-stats) — Pixlify · Free — Rolling number counters
-   [Clipped Words](/component/clipped-words) — Interface Studio · $5 — Words With a Little Chaos
