X Tutup
Skip to content

WJDDesigns/Ultra-Card

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

309 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

hacs_badge

Ultra Card

The Visual Dashboard Builder for Home Assistant

Build professional Home Assistant dashboards without writing YAML. Ultra Card is a modular card builder that turns dashboard creation into an intuitive visual design experience. Drag-and-drop layouts, a rich set of modules, and a powerful editor put full creative control in your hands—whether you're new to Home Assistant or a power user.

preview-uc

UltraCard.io · Discord · Documentation


Why Ultra Card?

Visual-first — Every feature and setting is available through the UI. No YAML required.

Modular layout engine — Dozens of module types, drag-and-drop columns, and unlimited nesting so you can build any dashboard layout you imagine.

Built for performance — TypeScript, smart caching, and responsive design so cards run smoothly from phones to large displays.

Preset Marketplace — Install community presets with one click, preview before installing, and share your own designs.

Pro: ecosystem unifier — Embed any custom Home Assistant card (Bubble Card, Mushroom, ApexCharts, and more) inside Ultra Card’s layout system. Third-party cards are unlimited for all users.

Pro: cloud & backups — Cloud sync, automatic daily backups (30-day retention), and manual snapshots so your work is safe and available everywhere.


Features at a Glance

  • Drag-and-drop builder — Arrange layouts with instant feedback
  • 4-tab module editor — General, Actions, Logic, and Design per module
  • 19+ module types — Text, Icon, Info, Image, Markdown, Bar, Graphs, Camera, Button, Slider, Spinbox, Dropdown, Light, Gauge, layouts, Tabs, Separator, plus Pro animated modules
  • Conditional logic — Show or hide by entity state, time, or Jinja2 templates
  • Full Jinja2 support — Templates with CodeMirror editor
  • Native & 3rd party cards — Unlimited native and third-party cards for everyone
  • Design controls — Typography, colors, spacing, borders, shadows, gradients, animations
  • Preset Marketplace — Browse, install, and share community presets
  • 15 languages — Full internationalization

Quick Start

Install

HACS (recommended)

Open your Home Assistant instance and open a repository inside the Home Assistant Community Store.

Or add https://github.com/WJDDesigns/Ultra-Card as a custom Lovelace repository in HACS, install Ultra Card, then restart Home Assistant.

Manual

  1. Download ultra-card.js from the latest release.
  2. Place it in config/www.
  3. Add a resource: SettingsDashboardsResources → Add Resource → URL /local/ultra-card.js, type JavaScript Module.

Create your first card

  1. Edit a dashboard → Add cardCustom: Ultra Card.
  2. Use the Layout Builder tab to add and arrange modules.
  3. Use the 4-tab editor (General, Actions, Logic, Design) on each module to configure content, taps, visibility, and styling.

Optional: Pro

Visit UltraCard.io for cloud sync, automated backups, exclusive animated modules (Clock, Weather, Forecast, Video Background), and third-party card integration.


Modules

Category Modules
Content Text, Icon, Info, Image, Markdown, Bar, Graphs, Camera
Controls Button, Slider, Spinbox, Dropdown, Light, Gauge
Layout Horizontal, Vertical, Tabs, Separator
Pro Animated Clock, Animated Weather, Animated Forecast, Video Background

Module docs: Text, Icon, Info, Image, Markdown, Bar, Graphs, Camera, Button, Horizontal, Vertical, Separator.

Card integration — Use unlimited native Home Assistant cards inside Ultra Card. Add Bubble Card, Mushroom Cards, ApexCharts, and other custom cards—unlimited for all users.


Free vs Pro

Feature Free Pro
Core modules & visual editor Yes Yes
Preset Marketplace Yes Yes
Conditional logic & templates Yes Yes
Native HA cards Unlimited Unlimited
3rd party cards Unlimited Unlimited
Cloud configuration sync Yes
Automatic daily backups (30-day) Yes
Manual snapshots (up to 30) Yes
Video Background, Animated Clock/Weather/Forecast Yes
Priority support Yes

Get Pro at UltraCard.io


Preset Marketplace

Browse and install community presets from inside the editor: Presets tab → Browse Marketplace. One-click install, categories, previews, and favorites. You can submit your own presets for others to use.


Translations

Supported languages: Catalan, English, British English, German, French, Spanish, Italian, Dutch, Norwegian, Danish, Czech, Polish, Swedish, Portuguese, Russian.

To contribute translations, see CONTRIBUTING_TRANSLATIONS.md. You can edit files in src/translations/ on GitHub and open a pull request.


Community & Support

Pro subscribers get priority support. You can also support development with a one-time tip.


Contributing

Contributions are welcome: translations, presets, code, and documentation. See CONTRIBUTING_TRANSLATIONS.md for translations and DEVELOPMENT.md for local development. Please open pull requests with clear descriptions.


Technical Details

  • Requirements: Home Assistant 2024.1.0+, modern browser (ES2015+). HACS recommended.
  • Stack: TypeScript, smart caching, responsive layout.
  • Privacy: No tracking; free tier is local-only; Pro sync uses encrypted connections. Open source on GitHub.

License

MIT — see license file.


Created by WJD Designs. Thanks to the Discord community and everyone who contributes presets, translations, and feedback.

Built for Home Assistant

About

A powerful modular card builder for Home Assistant that lets you create custom layouts with a professional page-builder interface.

Topics

Resources

License

Contributing

Stars

Watchers

Forks

Packages

 
 
 
X Tutup