This is an automated archive made by the Lemmit Bot.

The original was posted on /r/homeassistant by /u/nutteloost on 2025-07-17 18:53:53+00:00.

Todo Swipe Card v3.0.0

Just released a complete rewrite of my Home Assistant todo card with some major improvements:

✨ No more card-mod dependency - The card now includes native styling out of the box while still supporting full customization through 60 (!) CSS variables

🔍 New search functionality - Type to search through your todo items or quickly add new ones with Enter

Features ⭐️

• Swipe between multiple todo lists with smooth animations
• Built-in styling with customizable options through themes and card mod
• Pagination dots for visual navigation
• Configurable spacing between cards
• Options to show or hide completed items
• Delete completed items button with optional confirmation dialog
• Search items through your list
• Add icons on each list
• Background image support for individual lists
• Full visual editor support
• Mobile-friendly touch and mouse navigation
• Extensive customization through 60 CSS variables

Demo 🎬

Example 1

Configuration Example 🗒️

You can configure the card using the visual editor or with YAML:

type: custom:todo-swipe-card
show_pagination: false
show_addbutton: true
show_create: true
show_completed: true
show_completed_menu: true
enable_search: true
delete_confirmation: true
card_spacing: 10
entities:
  - todo.albert_heijn
  - todo.jumbo
  - todo.ikea
  - todo.hornbach
  - todo.action
background_images:
  todo.albert_heijn: /local/images/background_image/albert_heijn.png
  todo.jumbo: /local/images/background_image/jumbo.png
  todo.ikea: /local/images/background_image/ikea.png
  todo.hornbach: /local/images/background_image/hornbach.png
  todo.action: /local/images/background_image/action.png

Visual Editor 🛠️

The card includes a comprehensive visual editor that allows you to add or remove todo lists, configure display options, set background images for individual lists, and adjust spacing without writing any YAML code.

You can show and hide several elements in the card such as the text input field, add button and the delete button. With these options it is possible to use this card as a ‘read-only’ task list which only shows tasks and the possibility to mark them as completed.

Customization Examples 🎨

The card supports extensive theming through 60 custom CSS variables. Here is an example of a customized colored list with title and icon:

Example 2

Installation & More Information ℹ️

All installation instructions, configuration details, and customization options are available in the GitHub repository:

GitHub - nutteloost/todo-swipe-card: A specialized swipe card for todo lists in Home Assistant

I look forward to seeing how you integrate this card into your Home Assistant dashboards. If you have feedback or encounter any issues, please feel free to reach out through the GitHub repository.