Integration and Usage

You can add the notification with the client side export anywhere in your scripts you want to use the notifications.

Usage

Client Export

exports['cornerstone_notify']:sendNotification(title, message, type, duration, position, icon, sound)

Client Event

TriggerEvent('Notify:sendNotification', title, message, type, duration, position, icon, sound)

Server to Client

TriggerClientEvent('Notify:sendNotification', source, title, message, type, duration, position, icon, sound)

Parameters

Parameter	Type	Required	Description
title	string	Yes	Notification title
message	string	Yes	Notification message body
type	string	No	Notification type (see types below)
duration	number	No	Display time in ms (default: 5000)
position	string	No	Screen position (if Config.usePosition is false)
icon	string	No	Custom icon (Material Icons name or Font Awesome class)
sound	string	No	Sound file URL to play

Examples

-- Basic notification
exports['cornerstone_notify']:sendNotification('Success', 'Your action was completed!')

-- With type
exports['cornerstone_notify']:sendNotification('Error', 'Something went wrong', 'error')

-- With duration
exports['cornerstone_notify']:sendNotification('Warning', 'Be careful!', 'warning', 8000)

-- With custom Font Awesome icon
exports['cornerstone_notify']:sendNotification('Discord', 'New message received', 'info', 5000, nil, 'fa-brands fa-discord')

-- With custom Material icon
exports['cornerstone_notify']:sendNotification('Money', 'You received $500', 'success', 5000, nil, 'payments')

-- With sound
exports['cornerstone_notify']:sendNotification('Alert', 'Important notification', 'warning', 5000, nil, nil, 'sounds/alert.ogg')

---

Notification Types

Type	Icon	Colors	Use Case
success	check_circle	Green gradient	Completed actions, confirmations
error	error	Red gradient	Errors, failures, problems
warning	warning	Orange/yellow gradient	Cautions, alerts
info	info	Blue gradient	Information, tips
general	notifications	Brand gradient	General notifications
police	local_police	Blue gradient	Police/law enforcement
ems	medical_services	Red gradient	Medical/EMS
custom	star	Purple gradient	Custom notifications

Example of the Dark Mode Card Success

---

Themes

Theme	Background	Accent Colors	Style
dark	Blue-gray gradient	Rainbow multi-color	Default, vibrant
light	White gradient	Blue	Clean, bright
ocean	Deep navy-blue	Cyan to blue	Cool, calm
forest	Dark green	Green gradient	Natural, earthy
sunset	Warm brown-red	Coral to peach	Warm, cozy
midnight	Deep purple	Purple to lavender	Dreamy, elegant
blossom	Dark magenta	Pink to magenta	Feminine, playful
glass	Translucent gray	Clean blue	Modern, minimal
neon	Near black	Pink and cyan	Cyberpunk, gaming
ember	Dark red-brown	Red to orange-yellow	Fire, intense
arctic	Slate blue	White to ice blue	Cold, crisp
gold	Dark brown	Gold to amber	Luxury, premium
mono	Neutral gray	White to gray	Minimalist, clean
vapor	Dark purple	Pink-cyan-purple	Vaporwave, retro
toxic	Dark green-black	Lime to yellow	Radioactive, tech
blood	Dark red-black	Deep red to crimson	Dark, dramatic

Example of Arctic Theme

---

Layouts

Layout	Description
card	Full-sized card with icon, title, message, and progress bar. Best for detailed notifications.
compact	Single-line slim notification with inline elements. Great for rapid, non-intrusive alerts.
minimal	Streamlined design with reduced visual elements. Clean and unobtrusive.

Compact and Minimal Layouts

---

Animations

Animation	Description
slide	Slides in from the side with subtle overshoot. Classic, professional.
fade	Fades in/out with opacity transition. Subtle, non-distracting.
zoom	Scales up from small to full size. Attention-grabbing.
bounce	Bounces in with elastic movement. Playful, energetic.
flip	3D flip rotation effect. Unique, eye-catching.
elastic	Springy overshoot with multiple wobbles. Satisfying, smooth.
glitch	Cyberpunk-style with RGB shifts and artifacts. Edgy, tech-themed.
swing	Pendulum rotation swinging into place. Elegant, natural.
drop	Falls from above with gravity and bounce. Physics-based, playful.
blur	Fades in from blurred state, coming into focus. Cinematic, smooth.
morph	Expands from small pill shape to full size. Modern, fluid.

---

Stacking Modes

Mode	Description
cascade	Notifications scale down and fade as they stack. Newest is full size, older ones smaller.
stack	Cards pile with diagonal offset like stacked papers. Visual depth indicator.
overlay	Notifications overlap with slight vertical offset. Compact, saves space.
list	Straight vertical list with no overlap. Each notification fully visible.
fan	Notifications fan out at angles like cards. Dramatic, eye-catching.

Multiple stacking options

---

Positions

Position	Location
top-left	Upper left corner
top-center	Upper center
top-right	Upper right corner
left	Middle left side
right	Middle right side
bottom-left	Lower left corner
bottom-center	Lower center
bottom-right	Lower right corner

---

Replacing Default Notifications

Ox Lib

Before

Replace the default Ox Lib notification

ox-lib > resource > interface > client > notify.lua around line 30

---`client`
---@param data NotifyProps
---@diagnostic disable-next-line: duplicate-set-field
function lib.notify(data)
    local sound = settings.notification_audio and data.sound
    data.sound = nil
    data.position = data.position or settings.notification_position

    SendNUIMessage({
        action = 'notify',
        data = data
    })

    if not sound then return end

    if sound.bank then lib.requestAudioBank(sound.bank) end

    local soundId = GetSoundId()
    PlaySoundFrontend(soundId, sound.name, sound.set, true)
    ReleaseSoundId(soundId)

    if sound.bank then ReleaseNamedScriptAudioBank(sound.bank) end 
    
end

After

---`client`
---@param data NotifyProps
---@diagnostic disable-next-line: duplicate-set-field
function lib.notify(data)
 exports['cornerstone_notify']:sendNotification(data.title,
       data.description, data.type, data.duration, data.sound)
end

Qbox

QB Core

ESX