Liquid Glass Hydration

Water Reminder App UI Template

Dewdrop is a hydration-tracking app design with a frosted liquid-glass look, built for founders and designers shipping a water reminder product.

Use this template

Water reminder app home screen with a living-glass vessel filled to 58 percent and Log Water button

Water reminder app log-a-drink sheet with drink type cards and portion stepper

Water reminder app reminders screen with interval, time window, and sip pace selector

Explore the screens

Preview the water reminder mobile app design, fully editable in Sleek.

InsightsScreen 4

HistoryScreen 5

ProfileScreen 6

About the Water Reminder App

Dewdrop is a water reminder app UI built around a "Liquid Glass Hydration" aesthetic: a soft mist-white base, deep-aqua ink, and a cyan-to-teal gradient reserved for water fills and primary actions. Surfaces read as frosted-glass panels floating over a faint water wash, with wide tonal capsule buttons and a floating pill dock at the bottom. The signature is a tall living-glass vessel on the home screen that fills with cyan water as intake is logged, with a percentage floating inside.

The template ships six connected screens that form a complete hydration flow: a Today home with the living glass at 58% and a "Log Water" button, a Log a Drink sheet for choosing water, coffee, herbal tea, or sparkling with portion steppers, a Smart Nudges schedule for reminder intervals and sip pace, an Insights view with a goal ring and hydration-by-hour bars, a History screen with weekly bars and a 12-day streak, and a Profile with weight goal, daily goal, units, and Apple Health sync.

Use it in Sleek and make it yours: restyle the palette, edit any screen with AI by describing the change, and add the flows your product needs. Then export it to code, copy it into Figma, or hand a prompt to an AI agent to build it for real, a far faster start than a blank canvas.

Screens included

Today

A home screen with the oversized "1,450 / 2,500 ml" intake number above a living-glass vessel filled to 58%, plus a cyan-to-teal "Log Water" capsule. The at-a-glance daily progress that keeps users sipping.

Log a Drink

A sheet asking "What are you sipping on?" with drink cards for Water, Coffee, Herbal Tea, and Sparkling, each tagged with a hydration multiplier, plus a portion stepper and a "Confirm Log" button. Makes logging any drink quick and accurate.

Smart Nudges

A reminder schedule with an Active Hours toggle, interval (every 90 min) and time window controls, a Sip Pace selector (Chilled, Steady, Intense), and a timeline of upcoming nudges. The heart of the water reminder experience.

Insights

A "Your Insights" view with a hydration goal ring at 58%, logged and remaining figures, and a hydration-by-hour bar chart. Surfaces patterns like drinking most before noon.

History

A trends screen with a 12-day streak badge, a 2,180 ml daily average, weekly bars for the last 7 days, and a monthly report link. Shows long-term hydration habits at a glance.

Profile

A profile with the user's name and Premium tier, a health profile for weight goal, daily goal, and units, plus Apple Health sync and reminder sound settings. Where users tune their hydration targets.

Key features

Liquid Glass Hydration aesthetic: mist white, deep aqua, cyan-to-teal fills
Signature living-glass vessel that fills as intake is logged
Frosted-glass panels with soft 28px corners and no hard shadows
Floating pill navigation dock with a glowing active icon
Drink logger with hydration multipliers and portion steppers
Smart reminder scheduling with interval, window, and sip-pace controls
Insights goal ring and hydration-by-hour bar chart
History view with weekly bars, daily average, and streak badge

Who it's for

Founders validating a hydration or water-tracking app MVP

Product designers needing a polished water reminder UI starting point

Indie developers building a wellness or habit-tracking app

Health-tech teams prototyping a daily-intake experience

What you can build

Launch an MVP for a water reminder or hydration app
Mock up screens for an investor or stakeholder pitch
Hand a consistent hydration UI off to developers
Explore a redesign of an existing wellness tracker

How to use this template

1
Open the template
Browse the screens and preview the full design to see if it fits your idea.
2
Use this template
Open your own fully editable copy in Sleek with one click.
3
Edit with AI
Restyle the palette, change layouts, and add or remove screens just by describing what you want.
4
Export and ship
Export your design or hand it to developers, and keep building toward launch.

Questions, answered. Everything to know before you start.

How do I build a water reminder app from this template?

Click "Use this template" to open it in Sleek as your own editable project, then shape it by describing the changes you want: restyle the palette, edit any screen, and add the flows your product needs. You start from six complete screens instead of a blank canvas, so you reach a working water reminder app UI far faster.

What screens are included in this water reminder app UI template?

Six connected screens: Today with the living-glass vessel, a Log a Drink sheet, a Smart Nudges reminder schedule, an Insights view with a goal ring, a History trends screen, and a Profile. Together they cover the core flow of a real hydration app, from logging a drink to tracking streaks.

Can I customize the hydration tracking UI?

Yes. Use the template in Sleek and edit any screen by chatting with the AI: change the cyan-to-teal palette, adjust the living-glass vessel, swap drink types, or rework the reminder schedule. There's no manual redraw; you describe the change and it's applied.

Is this water reminder app template free to use?

You can open and explore the design for free, then use it in your own Sleek project to build on it. Editing and exporting follow Sleek's standard plans.

Can I export the design to code or Figma?

Yes. Sleek exports your design as code, copies straight into Figma with no plugin, or hands you a ready-made prompt that an AI agent like Claude Code or Cursor can use to build it into a real, working app.

Does the template support logging drinks other than water?

It does. The Log a Drink sheet includes Water, Coffee, Herbal Tea, and Sparkling, each with a hydration multiplier and a portion stepper. You can add or rename drink types in Sleek to fit your product.

Something else? Write to support@sleek.design.