Blue · To-do list · 4 × 2 widget
Blue to-do list widget
A blue to-do list widget keeps today's tasks on your home screen with boxes you can tick. Calm sky and navy tones. This page gives the exact colors, type settings and layers, with a preview drawn from the same values.

What a blue to-do list widget shows
A to-do widget works when it is short. Three tasks, a clear title and a box to tap are enough; a long list belongs in an app.
WidgetCraft stores local tasks on the phone, which is a free source and needs no account or permission. Tapping a row can tick the task from the home screen.
How the blue style shapes it
Blue widgets feel calm and clear. This recipe pairs a pale sky background with navy text and a mid-blue accent; flip the colors for a deep navy version.
- Lists: Round azure checkboxes with navy text.
- Text: Use navy text and slate-blue labels.
Blue to-do list widget recipe
| Layer | Settings |
|---|---|
| Canvas | 360 × 200, background #E3F0FF, corner radius 22 |
| Text | title "Today", built-in Sans, size 22, color #0F2A4A |
| Text | count such as "1 of 3", size 12, color #6C87A8, right aligned |
| List | local tasks, 3 rows, row height 38, text size 16 in #0F2A4A |
| Checkbox | 18 × 18, radius 4, outline #6C87A8; done state filled #2F7BE6 |
| Done rows | text #6C87A8 with strikethrough |
| Font | built-in Sans |
| Home screen size | 4 × 2 cells |
Blue color palette
- Sky
#E3F0FFBackground - Powder blue
#C5DEFASurface and tracks - Navy
#0F2A4AText - Slate blue
#6C87A8Labels - Azure
#2F7BE6Accent
How to make a blue to-do list widget in WidgetCraft
- Create a widget and open Canvas. Set the size to 360 × 200, the background to #E3F0FF and the corner radius to 22.
- Add a Text layer for the title "Today" at size 22 in #0F2A4A.
- Tap Add and choose List. In Data, choose your local task list and limit it to three rows.
- Set the row text to size 16 in #0F2A4A and the checkbox to 18 × 18 with radius 4.
- Style finished rows in #6C87A8 and set the tick color to #2F7BE6. In Tap, set a row tap to tick the task.
- Tap Save, then Add to home screen and resize the widget on your launcher if needed.
Everything in this recipe works in the free version.
Tips for blue to-do list widgets
- Stay within one hue from pale to navy.
- Use the brightest blue only for progress.
- Limit the list to three or four rows so each stays easy to tap.
- Make finished tasks visibly different: grey text and a strikethrough.
- Tap targets on a widget should be at least 48 dp high.
- Do not add warm accents unless you want strong contrast.
- Do not use mid-blue text on a mid-blue background.
Questions about the blue to-do list widget
What size is a blue to-do list widget?
It is designed for 4 × 2 home screen cells on a 360 × 200 canvas. You can resize it on the launcher and the design scales in proportion.
Which colors does it use?
Sky (#E3F0FF) for the background, Navy (#0F2A4A) for the main text, Slate blue (#6C87A8) for labels and Azure (#2F7BE6) as the accent.
Is it free to make?
Yes. To-do list widgets use free features in WidgetCraft, and the blue styling is free too.
What else is this style called?
People also search for blue aesthetic to-do list widget, navy to-do list widget, ocean to-do list widget. They describe the same look as this blue to-do list widget.
More blue widgets
- Blue clock widget
- Blue analog clock widget
- Blue calendar widget
- Blue battery widget
- Blue countdown widget
- Blue photo widget
- Blue quote widget
- Blue music widget
- Blue year progress widget
- Blue step counter widget
- Blue habit tracker widget
- Blue sticky note widget
- Blue world clock widget
- Blue date widget
- Blue home screen setup
- All blue widgets