Build even faster with packages

This package simplifies the use of Shoelace library web components. It is currently under development, with many more components, events and actions expected to be added.

The Spark Drag and Drop Package is a powerful tool to create sortable lists and kanban boards, based on the fantastic SortableJS library.

Custom action to unleash confetti on users!

Date and Time picker for your Toddle project. It is designed to be lightweight, simple to use, and feature-rich without relying on external dependencies. Build with vanilla-calendar.pro.

Some handy elements and icons to get started. Currently includes dropdown, tooltip, drag and drop list, an inline value edit, buttons, tabs, accordion, and icons.
More elements to be added/updated over time.

Block-style editor with a universal JSON output.

A rich text editor for toddle based on quill.js

Beautiful feedback to events with ease. A single toaster component with the ability to trigger toasts from anywhere!

A carousel is a dynamic element commonly used to showcase multiple images or pieces of content within a confined space. A carousel is excellent for user interfaces that have confined elements for content. Social networks like Facebook or Instagram use carousels for images. It allows them to show multiple images in a single card in their feeds.

Simple accordion component. Use ui-accordion inside ui-accordions

Responsive range slider with a rich set of settings, including pointers (knobs), vertical and horizontal slider, touch, mousewheel and keyboard support, range dragging, RTL support and many more features.

A simple and customizable chart component. Takes in json data and displays it in various chart styles using Chart.js.

Display numbers for any currency format.

Dynamic Table that allows you to:
- have certain columns sticky on the left during scrolling
- hide/show certain columns
- search by specific visible columns
- sort by any visible column
- pagination
- customize items per page
- is i18n compatible
- allows to add action buttons
- allows you to add select checkboxes

A chart package built within toddle with no library imports.

Tags input component

Dropdown container component that adapts to any use case.

Formulas and actions that are useful when working with geolocation in the browser 🧭
It allows you to easily request the user's location once - or watch it as it updates 🗺️

Render Markdown content in toddle.

Nocode-UI is a collection of UI components inspired by Shadcn/ui and TailwindCSS. This is an early-access version, only the card, input and button component are included!

Play lottie animations in toddle.

dotLottie is an open-source file format that aggregates one or more Lottie files and their associated resources into a single file. They are ZIP archives compressed with the Deflate compression method and use the file extension of ".lottie".

Code editor based on Monaco, powering tools such as vs-code.

Spline is a 3D builder where you can create engaging scenes and even 3D Games. This package enables you to load Spline scenes natively in toddle.

A very powerful and flexible calendar for Toddle, built entirely in Toddle. Feature-rich and extremely customizable.

OpenAI Chat Streaming custom action for toddle.dev

A single action to listen for changes in a given media query. Executes a callback when the query matches or doesn’t match. Can be used for viewport changes, or changes to system theme settings, device orientation etc.

Render dynamic html content e.g. from CMS in toddle

A simple JSON viewer built 100% in toddle

Give your default scrollbars a makeover with this tiny package - because even scrollbars deserve to dress up and impress your users!

TypeIt is a JavaScript library that makes it easy to create flexible, dynamic typewriter effects for the web.

Custom formula that allows you to use the switch / case statement inside your the node editor.

model-viewer allows interacting with rich 3D models using a customizable component 👍

Cool icon pack with all the popular social networks.

Embed YouTube videos, shorts, and playlists. This component loads YouTube Embed iframes faster.

Horizontal scrolling Netflix-style — grab or scroll content sideways!

Scheduling infrastructure for everyone. Meet Cal.com, the event-juggling scheduler for everyone. Focus on meeting, not making meetings. Free for individuals.

Easy scheduling ahead
Calendly is your scheduling automation platform for eliminating the back-and-forth emails to find the perfect time — and so much more.

Easy to use component to check where content is compared to the viewport. Useful for delaying rendering or playing animations on scroll.

StudioForm is a powerful, feature-rich multi-step forms framework that was originally developed for Webflow. Then Wized. Now toddle. It's ideal when you need to capture a lot of data from your users at once. Think application forms, onboarding flows, step-by-step project request forms, surveys, etc.

A package for creating spring animations in toddle

A simple dialog that you can populate with several onboarding steps.

Wrap any element in a ripple component to add a ripple effect on the pointer-down. Ripple is based on Material Design and is often used to provide better feedback to interactable areas.

Add tracking scripts to your site

Mostly for internal use will be maintaining for agency but you are welcomed to try it out, can't guarantee good support to feature requests or bugs.

No-Code CSV Excel Importer to customer's data in Toddle Application!

Features:
- Supports providing userId
- Scalable to import large amount of records
- User Friendly editor
- One-click column mapping
- Themeable
- Supports multiple importers on the same page

Demo available on, https://csv_excel_importer.toddle.site

Feel free to contact bhavik@impler.io for any help or questions.

A Bézier curve editor. Useful for creating timing functions to use in toddle or in standard CSS.

Control media playback in toddle. Add sound effects to your toddle app, or building a custom video player!

Show your love for toddle with a "built-in-toddle" button

A color picker built 100% in toddle.

No description available 🙄

A zoom / scroll panel like the one used in toddles editor

No description available 🙄

A simple component using PDFJS to load and view PDFs.

No description available 🙄

Ui package with the current components. FYI UNDER DEVELOPMENT

Table
- ui-tabel
- ui-tabel_head
- ui-tabel_header_cell
- ui-tabel_body
- ui-tabel_row
- ui-table_data_cell
- ui-avatar
- ui-avatar_group

UI
- ui-checkbox
- ui-counter
- ui-dimmer
- ui-divider
- ui-button
- ui-button_icon
- ui-spinner
- ui-alert_banner

Primitives
- primitive-helptext
- primitive-label

No description available 🙄

No description available 🙄

No description available 🙄

No description available 🙄

Gorgeous Data Visualization in Toddle

No description available 🙄

No description available 🙄

A basic element to upload files to Supabase Storage

new

Outseta is a service that offers membership solutions as a service. Install the package to access a fully built membership service that allows you to charge for certain gated content or products.

This is a package to embed typeform directly to your toddle projects. It makes it a lot easier to embed, and they run much smoother than an iframe.

No description available 🙄

No description available 🙄

Super secret package! Might be something with our new website! Who knows 🤷‍♀️

Generate unique words based on standard dictionaries or provide your own 🎉

Very much an alpha plottly package.

A package for integrating cello into your app.

Cello is an innovative user-led growth marketing platform designed to supercharge your customer referral program. Cello enables you to integrate a rewarding referral experience directly into your product, simplifying user engagement and enhancing the reach of your brand.

No description available 🙄

No description available 🙄

No description available 🙄

No description available 🙄