Components Local time

Petal Pro is the full SaaS app this is built for

Auth, billing, admin, and Claude Code integration included. One purchase, unlimited projects.

See what's included
Petal Pro

Local time

Display the user's local time in the format of your choice.
UTC:
Thu, 07 May 2026 07:33:13 +0000
Local:
heex

How to access

Membership
$299
-> 
See plans

This comes with Petal Pro. Purchase a membership to get access to this package. It can be used with any Phoenix project. Post-expiration, you'll retain access but won't be eligible for updates from newer versions.

Here’s a list of the presets:

DATE_SHORT => 10/14/1983
DATE_MED => Oct 14, 1983
DATE_MED_WITH_WEEKDAY => Fri, Oct 14, 1983
DATE_FULL => October 14, 1983
DATE_HUGE => Friday, October 14, 1983
TIME_SIMPLE => 1:30 PM
TIME_WITH_SECONDS => 1:30:23 PM
TIME_WITH_SHORT_OFFSET => 1:30:23 PM EDT
TIME_WITH_LONG_OFFSET => 1:30:23 PM Eastern Daylight Time
TIME_24_SIMPLE => 13:30
TIME_24_WITH_SECONDS => 13:30:23
TIME_24_WITH_SHORT_OFFSET => 13:30:23 EDT
TIME_24_WITH_LONG_OFFSET => 13:30:23 Eastern Daylight Time
DATETIME_SHORT => 10/14/1983, 1:30 PM
DATETIME_MED => Oct 14, 1983, 1:30 PM
DATETIME_FULL => October 14, 1983 at 1:30 PM EDT
DATETIME_HUGE => Friday, October 14, 1983 at 1:30 PM Eastern Daylight Time
DATETIME_SHORT_WITH_SECONDS => 10/14/1983, 1:30:23 PM
DATETIME_MED_WITH_SECONDS => Oct 14, 1983, 1:30:23 PM
DATETIME_FULL_WITH_SECONDS => October 14, 1983 at 1:30:23 PM EDT
DATETIME_HUGE_WITH_SECONDS => Friday, October 14, 1983 at 1:30:23 PM Eastern Daylight Time

If you want precise formatting, you can use the format attribute. See the Luxon docs for more information.

Properties

elixir 
            # <.local_time>
  attr(:for, :string, default: nil, doc: "A DateTime or Timex struct.")
  attr(:preset, :string, default: "DATE_MED", values: ["DATE_SHORT", "DATE_MED", "DATE_MED_WITH_WEEKDAY", "DATE_FULL", "DATE_HUGE", "TIME_SIMPLE", "TIME_WITH_SECONDS", "TIME_WITH_SHORT_OFFSET", "TIME_WITH_LONG_OFFSET", "TIME_24_SIMPLE", "TIME_24_WITH_SECONDS", "TIME_24_WITH_SHORT_OFFSET", "TIME_24_WITH_LONG_OFFSET", "DATETIME_SHORT", "DATETIME_MED", "DATETIME_FULL", "DATETIME_HUGE", "DATETIME_SHORT_WITH_SECONDS", "DATETIME_MED_WITH_SECONDS", "DATETIME_FULL_WITH_SECONDS", "DATETIME_HUGE_WITH_SECONDS"] doc: "A preset format.")
  attr(:format, :string)
  attr(:class, :string)
  attr(:locale, :string, doc: "The locale to use. Eg. 'en', 'fr', 'es', etc.")
  attr(:rest, :global, doc: "Forwarded to the time element.")