Oracle APEX Toast Notification: 5 Beautiful JS Libraries

Oracle APEX toast notification options don’t have to stop at the built-in apex.message.showPageSuccess message. It works fine, but it also looks exactly like every other APEX app on the internet. These five vanilla JavaScript libraries are a genuine drop-in upgrade, no framework, no build step, just a CDN link and a few lines of JavaScript.

Why Bother With an Oracle APEX Toast Notification at All?

It does. apex.message.showPageSuccess() and the built-in error region are reliable, accessible, and require zero setup. Nothing in this article is telling you they’re broken.

What they are is visually flat, and every default APEX app looks identical because of it. A toast library changes almost nothing about your application logic and changes everything about how finished the app feels to a client sitting across the table from you during a demo. If you care about the kind of visual polish that separates a “built by a developer” app from a “built by a product team” app, this is one of the cheapest upgrades available. I cover the same instinct from a layout angle in Oracle APEX Banner to Instantly Avoid Dev vs Prod Mistakes, small visual signals carry more weight than developers usually give them credit for.

How to Load Any Oracle APEX Toast Notification Library Into Your App

All five libraries install the same way: a CSS file and a JS file, loaded application-wide from a CDN. No npm, no bundler, no Node build step. In Shared Components, go to User Interface > JavaScript and User Interface > CSS, and add the File URLs for whichever libraries you want:

Firing a toast from a Dynamic Action

The most common real-world use: after a Process runs, fire a toast instead of (or alongside) the built-in success message. Add a Dynamic Action with a True Action of type Execute JavaScript Code, running after your Process completes:

// True Action: Execute JavaScript Code
toastr.success("Your changes have been saved.", "Database Updated");

Firing a toast from inside a Process (Ajax callback)

If the Process itself is called via apex.server.process (common in custom Dynamic Actions or plugin code), fire the toast in the success callback instead of a separate Dynamic Action:

apex.server.process("SAVE_RECORD", {}, {
    success: function( pData ) {
        toastr.success("Record saved.");
    },
    error: function() {
        toastr.error("Something went wrong.");
    }
});

1. Toastify-js

Zero dependencies~3KB

Lightweight, non-blocking, and completely unopinionated about styling, which makes it the easiest one to skin into a custom look. The screenshot below is a custom glassmorphism treatment built entirely with CSS overrides on top of Toastify’s base markup, proof that “minimal library” doesn’t mean “limited look.”

<!-- Shared Components > JavaScript > File URLs -->
https://cdn.jsdelivr.net/npm/toastify-js

<!-- Shared Components > CSS > File URLs -->
https://cdn.jsdelivr.net/npm/toastify-js/src/toastify.min.css

Toastify({
    text: "Record saved successfully!",
    duration: 3000,
    gravity: "top",
    position: "right",
    style: {
        background: "linear-gradient(to right, #00b09b, #96c93d)"
    }
}).showToast();

github.com/apvarun/toastify-js

2. SweetAlert2

Rich stylingAccessible

SweetAlert2 is usually known for full-screen modal alerts, but it has a dedicated toast mode that’s genuinely the most polished-looking option of the five out of the box. It’s the heaviest library here, so reach for it when visual richness matters more than payload size, confirmation flows, delete warnings, anything that benefits from a bit more visual weight.

<!-- Shared Components > JavaScript > File URLs -->
https://cdn.jsdelivr.net/npm/sweetalert2@11

<!-- Shared Components > CSS > File URLs -->
https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css

Swal.fire({
    toast: true,
    position: "top-end",
    icon: "success",
    title: "Record updated with gooey precision.",
    showConfirmButton: false,
    timer: 3000
});

github.com/sweetalert2/sweetalert2

3. Notyf

Zero dependencies~3KB

Notyf is the one to reach for when you want something that looks like it belongs in a modern SaaS product and nothing more. No configuration required to look good, the default styling alone reads clean and current. Unlike the others, you create one Notyf instance and reuse it, so initialize it once rather than on every call.

<!-- Shared Components > JavaScript > File URLs -->
https://cdn.jsdelivr.net/npm/notyf@3/notyf.min.js

<!-- Shared Components > CSS > File URLs -->
https://cdn.jsdelivr.net/npm/notyf@3/notyf.min.css

// Initialize once, e.g. in a Dynamic Action firing on Page Load
var notyf = new Notyf();

// Then call from anywhere on the page
notyf.success("Data synchronized successfully!");
notyf.error("Sync failed. Try again.");

github.com/caroso1222/notyf

4. iziToast

Physics-based animationHighly configurable

iziToast is the one built for motion. Bounce, flip, and slide transitions are built in, along with fine control over position, layout, and color themes. If a client wants something with more visual presence than a flat slide-in, this is usually the fastest way to deliver it without writing custom CSS animations yourself.

<!-- Shared Components > JavaScript > File URLs -->
https://cdn.jsdelivr.net/npm/izitoast/dist/js/iziToast.min.js

<!-- Shared Components > CSS > File URLs -->
https://cdn.jsdelivr.net/npm/izitoast/dist/css/iziToast.min.css

iziToast.success({
    title: "Success",
    message: "Record updated successfully.",
    position: "topRight"
});

github.com/marcelodolza/iziToast

5. Toastr

jQuery-basedBattle-tested

Toastr is the oldest and most widely deployed library on this list, and it has one practical advantage the other four don’t: it depends on jQuery, which is already loaded on every APEX page by default. That means no extra dependency to manage, just the two Toastr files. The tradeoff is a slightly dated default look compared to Notyf or SweetAlert2, though it’s easy to restyle with CSS overrides if you want it.

<!-- Shared Components > JavaScript > File URLs -->
https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js

<!-- Shared Components > CSS > File URLs -->
https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css

toastr.success("Your changes have been saved.", "Database Updated");

github.com/CodeSeven/toastr

The Power Move: Override APEX’s Native Message Functions Globally

Wiring a single Oracle APEX toast notification into one Dynamic Action is easy. Wiring it into every existing Process across an entire application, without touching a single one of them, is better. APEX exposes apex.message.showPageSuccess and apex.message.showErrors as JavaScript functions, and you can override them once, application-wide.

// Place in Shared Components > User Interface > JavaScript >
// "Execute when Page Loads", or a global Application-level include

apex.message.showPageSuccess = function( pMessage ) {
    toastr.success( pMessage );
};

apex.message.showErrors = function( pErrors ) {
    pErrors.forEach( function( e ) {
        toastr.error( e.message );
    });
};

Which Oracle APEX Toast Notification Library Should You Actually Pick?

If you want the smallest possible footprint with room to fully restyle, start with Toastify or Notyf. If you want something that looks finished the moment you add the CDN link with no CSS work at all, Notyf or SweetAlert2. If your team already knows jQuery and wants zero new concepts, Toastr installs in under two minutes since the dependency is already sitting in every APEX page. There’s no wrong answer here, the actual mistake is sticking with the flat default message region purely out of inertia. If you want a related trick for surfacing information without adding extra round trips to the page, the Smart Task Tracker article covers a similar “show more with less” instinct applied to reports instead of notifications.

A good Oracle APEX toast notification setup is one of those upgrades that costs almost nothing and pays off every time a client or end user opens the app. Which library did you end up using, or did you build your own? Drop a comment with what you’re running and why, I’d like to see what the rest of the APEX community landed on.