Build even faster with 📦's

Access a rich repository of packages that lets you build at the speed of light ⚡

Don’t build from scratch, install a package

You don’t have to reinvent the wheel. Install native packages with rich functionality and zero need to manage dependencies––no more broken plugins.

The fastest code is
the code you don't write

Install pre-built packages built by a world-class developer community and accelerate your time to market –– no coding required.

Skip the repetitive work.
Build reusable packages.

Design cool components, actions, or formulas, package them, and use them everywhere––no need to mess around with complicated formulas.

Tiny wrapper, enormous potential.

Tiny, but mighty upgrades that are available with in a single click. Browse the community packages and start to build.

Thumbnail for the Shoelace style package

Shoelace style

By leverall

20

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.

Thumbnail for the confetti package

confetti

By jacob

8

Custom action to unleash confetti on users!

Thumbnail for the quill package

quill

By andreas

8

A rich text editor for toddle based on quill.js

Thumbnail for the location package

location

By god_of_code

6

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 🗺️

Thumbnail for the Carousel package

Carousel

By vakis

6

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.

Thumbnail for the ui-accordion package

ui-accordion

By jacob

6

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

Thumbnail for the starter-pack package

starter-pack

By lucas

6

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.

Thumbnail for the Spark Drag and Drop package

Spark Drag and Drop

By max

5

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

Thumbnail for the currency-formatter package

currency-formatter

By Gazinhio

5

Display numbers for any currency format.

Thumbnail for the dotlottie package

dotlottie

By andreas

4

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".

Thumbnail for the Spline package

Spline

By vakis

4

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.

Thumbnail for the code-editor package

code-editor

By jacob

4

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

Thumbnail for the Social icons package

Social icons

By vakis

3

Cool icon pack with all the popular social networks.

Thumbnail for the html-block package

html-block

By andreas

3

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

Thumbnail for the markdown-block package

markdown-block

By andreas

3

Render Markdown content in toddle.

Thumbnail for the Editor.js package

Editor.js

By leverall

3

Block-style editor with a universal JSON output.

Thumbnail for the Custom switch statement package

Custom switch statement

By lululucaschae

2

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

Thumbnail for the Web media package

Web media

By andreas

2

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

Thumbnail for the color-picker package

color-picker

By andreas

2

A color picker built 100% in toddle.

Thumbnail for the Tool Cool Range Slider package

Tool Cool Range Slider

By leverall

2

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.

Thumbnail for the lite package

lite

By vakis

2

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

Thumbnail for the horisontal-scroll-section package

horisontal-scroll-section

By svenning

2

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

Thumbnail for the Minimalistic Chart package

Minimalistic Chart

By lululucaschae

1

A chart package built within toddle with no library imports.

Thumbnail for the Vanilla Calendar package

Vanilla Calendar

By leverall

1

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.

Thumbnail for the ps-table package

ps-table

By Pioneer_Solutions

1

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

Thumbnail for the ui-toast package

ui-toast

By jacob

1

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

onboarding_wizard

By andreas

1

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

Thumbnail for the Chart.js package

Chart.js

By lululucaschae

1

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

Add Commas In Numbers

By bishop

1

No description available 🙄

Thumbnail for the built in toddle package

built in toddle

By andreas

1

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

block test

By mows

No description available 🙄

Thumbnail for the Scrollbar Generator package

Scrollbar Generator

By leverall

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

"Packages make Toddle a virtually limitless No Code development tool."

Gareth, Nocode Coder

"toddle is like racing a new F1 vs Ford Model T and with packages, it’s the same race, but you also get a head start."

Lucas G, Founder