Notiflix Notify All Options

You can find all the options at the table below. You can click "Code View" tab to see usages of Init and Merge

Table View Code View

Notify Common Options:

Option	Default	Type	Description
width	280px	string	Changes the width. You can use "px" or "%"
position	right-top	string	7 types of positions you can use: right-top right-bottom left-top left-bottom center-top center-bottom center-center
distance	10px	string	Distance to body. You can use "px" or "%"
opacity	1	number	Changes the opacity. (Between 0 and 1)
borderRadius	5px	string	Changes the radius of the notifications corners.
rtl	false	boolean	Specifies the text direction to "right-to-left"
timeout	3000	number	Milliseconds to hide the Notifications. Tip: 3000 ms = 3 seconds.
messageMaxLength	110	number	Ignores characters of the message text after the specified number.
backOverlay	false	boolean	If you want to use a colored overlay you can change this option to true
backOverlayColor	rgba(0,0,0,0.5)	string	Changes the color of the back overlay. You can use HEX, RGB or RGBA.
plainText	true	boolean	All text contents are PlainText. If you want use format to HTML you can change this option to false
showOnlyTheLastOne	false	boolean	You can change this option as true to show only the last notification in the Notify module.
clickToClose	false	boolean	You can change this option as true to remove each notification without waiting for it to be automatically removed when it has been clicked.
ID	NotiflixNotify	string	Changes the ID (attribute) of the notifications.
className	notiflix-notify	string	Changes the class name (attribute) of the notifications.
zindex	4001	number	Changes the z-index.
useGoogleFont	false	boolean	The "Quicksand" font-family can be used via Google Fonts. If you want to use it you can set this option as true
fontFamily	Quicksand	string	Changes the font-family.
fontSize	13px	string	Changes the font-size of the message text.
cssAnimation	true	boolean	Notiflix uses CSS animations to show/hide the notifications. If you don't want to use CSS animations you can set this option to false
cssAnimationDuration	400	number	Changes the CSS animations duration as milliseconds. Tip: 400 ms = 0.4 second.
cssAnimationStyle	fade	string	6 types of styles you can use: fade zoom from-right from-left from-top from-bottom
closeButton	false	boolean	If you want to add a close button to notifications you can set this option to true (Notifications with close button will not disappear until they are clicked.)
useIcon	true	boolean	Allows the use of icons from the SVG or FontAwesome in notifications. By default, SVG type icons are defined. If you don't want to use Icons you can change this option to false
useFontAwesome	false	boolean	If you want to replace SVG icons to FontAwesome icons you can change this option to true
fontAwesomeIconStyle	basic	string	2 types of styles you can use: basic shadow
fontAwesomeIconSize	34px	string	Changes the font-size of the FontAwesome icons.

Notify Success Options:

Option	Default	Type	Description
background	#32c682	string	Changes the background color of Success.
textColor	#fff	string	Changes the text color of Success.
childClassName	success	string	Changes the class name of Success.
notiflixIconColor	rgba(0,0,0,0.2)	string	Changes the SVG icon color of Success.
fontAwesomeClassName	fas fa-check-circle	string	Changes the FontAwesome icon class name of Success. (Notiflix uses Font Awesome Free 5.5.0)
fontAwesomeIconColor	rgba(0,0,0,0.2)	string	Changes the FontAwesome icon color of Success.
backOverlayColor v2.2.0	rgba(50,198,130,0.2)	string	Changes the color of the back overlay. You can use HEX, RGB or RGBA. (Overrides the common "backOverlayColor" option for this type.)

Notify Failure Options:

Option	Default	Type	Description
background	#ff5549	string	Changes the background color of Failure.
textColor	#fff	string	Changes the text color of Failure.
childClassName	failure	string	Changes the class name of Failure.
notiflixIconColor	rgba(0,0,0,0.2)	string	Changes the SVG icon color of Failure.
fontAwesomeClassName	fas fa-times-circle	string	Changes the FontAwesome icon class name of Failure. (Notiflix uses Font Awesome Free 5.5.0)
fontAwesomeIconColor	rgba(0,0,0,0.2)	string	Changes the FontAwesome icon color of Failure.
backOverlayColor v2.2.0	rgba(255,85,73,0.2)	string	Changes the color of the back overlay. You can use HEX, RGB or RGBA. (Overrides the common "backOverlayColor" option for this type.)

Notify Warning Options:

Option	Default	Type	Description
background	#eebf31	string	Changes the background color of Warning.
textColor	#fff	string	Changes the text color of Warning.
childClassName	warning	string	Changes the class name of Warning.
notiflixIconColor	rgba(0,0,0,0.2)	string	Changes the SVG icon color of Warning.
fontAwesomeClassName	fas fa-exclamation-circle	string	Changes the FontAwesome icon class name of Warning. (Notiflix uses Font Awesome Free 5.5.0)
fontAwesomeIconColor	rgba(0,0,0,0.2)	string	Changes the FontAwesome icon color of Warning.
backOverlayColor v2.2.0	rgba(238,191,49,0.2)	string	Changes the color of the back overlay. You can use HEX, RGB or RGBA. (Overrides the common "backOverlayColor" option for this type.)

Notify Info Options:

Option	Default	Type	Description
background	#26c0d3	string	Changes the background color of Info.
textColor	#fff	string	Changes the text color of Info.
childClassName	info	string	Changes the class name of Info.
notiflixIconColor	rgba(0,0,0,0.2)	string	Changes the SVG icon color of Info.
fontAwesomeClassName	fas fa-info-circle	string	Changes the FontAwesome icon class name of Info. (Notiflix uses Font Awesome Free 5.5.0)
fontAwesomeIconColor	rgba(0,0,0,0.2)	string	Changes the FontAwesome icon color of Info.
backOverlayColor v2.2.0	rgba(38,192,211,0.2)	string	Changes the color of the back overlay. You can use HEX, RGB or RGBA. (Overrides the common "backOverlayColor" option for this type.)

Notiflix.Notify.Init({});

You can find the default options in an Init Function as below.


        // Notiflix Notify - All Options

        
            Notiflix.Notify.Init({

            width:'280px',
            position:'right-top',
            distance:'10px',
            opacity:1,
            borderRadius:'5px',
            rtl:false,
            timeout:3000,
            messageMaxLength:110,
            backOverlay:false,
            backOverlayColor:'rgba(0,0,0,0.5)',
            plainText:true,
            showOnlyTheLastOne:false,
            clickToClose:false,

            ID:'NotiflixNotify',
            className:'notiflix-notify',
            zindex:4001,
            useGoogleFont:false,
            fontFamily:'Quicksand',
            fontSize:'13px',
            cssAnimation:true,
            cssAnimationDuration:400,
            cssAnimationStyle:'fade',
            closeButton:false,
            useIcon:true,
            useFontAwesome:false,
            fontAwesomeIconStyle:'basic',
            fontAwesomeIconSize:'34px',

            

            success: {
            background:'#32c682',
            textColor:'#fff',
            childClassName:'success',
            notiflixIconColor:'rgba(0,0,0,0.2)',
            fontAwesomeClassName:'fas fa-check-circle',
            fontAwesomeIconColor:'rgba(0,0,0,0.2)',
            backOverlayColor:'rgba(50,198,130,0.2)',
            },


            

            failure: {
            background:'#ff5549',
            textColor:'#fff',
            childClassName:'failure',
            notiflixIconColor:'rgba(0,0,0,0.2)',
            fontAwesomeClassName:'fas fa-times-circle',
            fontAwesomeIconColor:'rgba(0,0,0,0.2)',
            backOverlayColor:'rgba(255,85,73,0.2)',
            },

            

            warning: {
            background:'#eebf31',
            textColor:'#fff',
            childClassName:'warning',
            notiflixIconColor:'rgba(0,0,0,0.2)',
            fontAwesomeClassName:'fas fa-exclamation-circle',
            fontAwesomeIconColor:'rgba(0,0,0,0.2)',
            backOverlayColor:'rgba(238,191,49,0.2)',
            },

            

            info: {
            background:'#26c0d3',
            textColor:'#fff',
            childClassName:'info',
            notiflixIconColor:'rgba(0,0,0,0.2)',
            fontAwesomeClassName:'fas fa-info-circle',
            fontAwesomeIconColor:'rgba(0,0,0,0.2)',
            backOverlayColor:'rgba(38,192,211,0.2)',
            },

            });

Notiflix.Notify.Merge({});

You can deeply extend the Init Function by using Merge Function. Examples of use are as below.

Website

global.js (Entire Website)


                // Notiflix Notify Init - global.js

                
                    Notiflix.Notify.Init({

                    width:'300px',
                    fontSize:'14px',
                    timeout:4000,
                    messageMaxLength:200,

                    });

contact.js (Contact Page)


                    // Notiflix Notify Merge - contact.js (The Merge Function, deeply extends the Global Init only for the Contact Page.)

                    
                        Notiflix.Notify.Merge({

                        width:'260px',
                        fontSize:'12px',

                        });

Notiflix Report All Options

You can find all the options at the table below. You can click "Code View" tab to see usages of Init and Merge

Table View Code View

Report Common Options:

Option	Default	Type	Description
className	notiflix-report	string	Changes the class name (attribute).
width	320px	string	Changes the width. You can use "px" or "%"
backgroundColor	#f8f8f8	string	Changes the background color.
borderRadius	25px	string	Changes the radius of the corners.
rtl	false	boolean	Specifies the text direction to "right-to-left"
zindex	4002	number	Changes the z-index.
backOverlay	true	boolean	If you don't want to use a colored overlay you can change this option to false
backOverlayColor	rgba(0,0,0,0.5)	string	Changes the color of the back overlay. You can use HEX, RGB or RGBA.
useGoogleFont	false	boolean	The "Quicksand" font-family can be used via Google Fonts. If you want to use it you can set this option as true
fontFamily	Quicksand	string	Changes the font-family.
svgSize	110px	string	Changes the SVG Icons width and height. (Notiflix uses square scaled icons.)
plainText	true	boolean	All text contents are PlainText. If you want use format to HTML you can change this option to false
titleFontSize	16px	string	Changes the font-size of the title text.
titleMaxLength	34	number	Ignores characters of title text after the specified number.
messageFontSize	13px	string	Changes the font-size of the message text.
messageMaxLength	400	number	Ignores characters of message text after the specified number.
buttonFontSize	14px	string	Changes the font-size of the button text.
buttonMaxLength	34	number	Ignores characters of button text after the specified number.
cssAnimation	true	boolean	Notiflix uses CSS animations to show/hide the Reports. If you don't want to use CSS animations you can set this option to false
cssAnimationDuration	360	number	Changes the CSS animations duration as milliseconds. Tip: 360 ms = 0.36 second.
cssAnimationStyle	fade	string	2 types of styles can use: fade and zoom

Report Success Options:

Option	Default	Type	Description
svgColor	#32c682	string	Changes the SVG icon color of Success.
titleColor	#1e1e1e	string	Changes the title text color of Success.
messageColor	#242424	string	Changes the message text color of Success.
buttonBackground	#32c682	string	Changes the button background color of Success.
buttonColor	#fff	string	Changes the button text color of Success.
backOverlayColor v2.2.0	rgba(50,198,130,0.2)	string	Changes the color of the back overlay. You can use HEX, RGB or RGBA. (Overrides the common "backOverlayColor" option for this type.)

Report Failure Options:

Option	Default	Type	Description
svgColor	#ff5549	string	Changes the SVG icon color of Failure.
titleColor	#1e1e1e	string	Changes the title text color of Failure.
messageColor	#242424	string	Changes the message text color of Failure.
buttonBackground	#ff5549	string	Changes the button background color of Failure.
buttonColor	#fff	string	Changes the button text color of Failure.
backOverlayColor v2.2.0	rgba(255,85,73,0.2)	string	Changes the color of the back overlay. You can use HEX, RGB or RGBA. (Overrides the common "backOverlayColor" option for this type.)

Report Warning Options:

Option	Default	Type	Description
svgColor	#eebf31	string	Changes the SVG icon color of Warning.
titleColor	#1e1e1e	string	Changes the title text color of Warning.
messageColor	#242424	string	Changes the message text color of Warning.
buttonBackground	#eebf31	string	Changes the button background color of Warning.
buttonColor	#fff	string	Changes the button text color of Warning.
backOverlayColor v2.2.0	rgba(238,191,49,0.2)	string	Changes the color of the back overlay. You can use HEX, RGB or RGBA. (Overrides the common "backOverlayColor" option for this type.)

Report Info Options:

Option	Default	Type	Description
svgColor	#26c0d3	string	Changes the SVG icon color of Info.
titleColor	#1e1e1e	string	Changes the title text color of Info.
messageColor	#242424	string	Changes the message text color of Info.
buttonBackground	#26c0d3	string	Changes the button background color of Info.
buttonColor	#fff	string	Changes the button text color of Info.
backOverlayColor v2.2.0	rgba(38,192,211,0.2)	string	Changes the color of the back overlay. You can use HEX, RGB or RGBA. (Overrides the common "backOverlayColor" option for this type.)

Notiflix.Report.Init({});

You can find the default options in an Init Function as below.


        // Notiflix Report - All Options

        
            Notiflix.Report.Init({

            className:'notiflix-report',
            width:'320px',
            backgroundColor:'#f8f8f8',
            borderRadius:'25px',
            rtl:false,
            zindex:4002,
            backOverlay:true,
            backOverlayColor:'rgba(0,0,0,0.5)',
            useGoogleFont:false,
            fontFamily:'Quicksand',
            svgSize:'110px',
            plainText:true,

            titleFontSize:'16px',
            titleMaxLength:34,

            messageFontSize:'13px',
            messageMaxLength:400,

            buttonFontSize:'14px',
            buttonMaxLength:34,

            cssAnimation:true,
            cssAnimationDuration:360,
            cssAnimationStyle:'fade',

            

            success: {
            svgColor:'#32c682',
            titleColor:'#1e1e1e',
            messageColor:'#242424',
            buttonBackground:'#32c682',
            buttonColor:'#fff',
            backOverlayColor:'rgba(50,198,130,0.2)',
            },

            

            failure: {
            svgColor:'#ff5549',
            titleColor:'#1e1e1e',
            messageColor:'#242424',
            buttonBackground:'#ff5549',
            buttonColor:'#fff',
            backOverlayColor:'rgba(255,85,73,0.2)',
            },

            

            warning: {
            svgColor:'#eebf31',
            titleColor:'#1e1e1e',
            messageColor:'#242424',
            buttonBackground:'#eebf31',
            buttonColor:'#fff',
            backOverlayColor:'rgba(238,191,49,0.2)',
            },

            

            info: {
            svgColor:'#26c0d3',
            titleColor:'#1e1e1e',
            messageColor:'#242424',
            buttonBackground:'#26c0d3',
            buttonColor:'#fff',
            backOverlayColor:'rgba(38,192,211,0.2)',
            },

            });

Notiflix.Report.Merge({});

You can deeply extend the Init Function by using Merge Function. Examples of use are as below.

Website

global.js (Entire Website)


                // Notiflix Report Init - global.js

                
                    Notiflix.Report.Init({

                    svgSize:'90px',
                    plainText:false,
                    messageMaxLength:200,

                    });

product.js (Product Page)


                    // Notiflix Report Merge - product.js (The Merge Function, deeply extends the Global Init only for the Product Page.)

                    
                        Notiflix.Report.Merge({

                        plainText:true,
                        messageMaxLength:300,

                        });

Notiflix Confirm All Options

You can find all the options at the table below. You can click "Code View" tab to see usages of Init and Merge

Table View Code View

Option	Default	Type	Description
className	notiflix-confirm	string	Changes the class name of the Confirm.
width	300px	string	Changes the width. You can use "px" or "%"
zindex	4003	number	Changes the z-index.
position	center	string	6 types of positions you can use: center center-top right-top right-bottom left-top left-bottom
distance	10px	string	Distance to body. You can use "px" or "%"
backgroundColor	#f8f8f8	string	Changes the background color. You can use HEX, RGB or RGBA.
borderRadius	25px	string	Changes the radius of the corners.
backOverlay	false	boolean	If you want to use a colored overlay you can change this option to true
backOverlayColor	rgba(0,0,0,0.5)	string	Changes the color of the back overlay. You can use HEX, RGB or RGBA.
rtl	false	boolean	Specifies the text direction to "right-to-left"
useGoogleFont	false	boolean	The "Quicksand" font-family can be used via Google Fonts. If you want to use it you can set this option as true
fontFamily	Quicksand	string	Changes the font-family.
cssAnimation	true	boolean	Notiflix uses CSS animations to show/hide the Confirm. If you don't want to use CSS animations you can set this option to false
cssAnimationStyle	fade	string	2 types of styles you can use: fade and zoom
cssAnimationDuration	300	number	Changes the CSS animations duration as milliseconds. Tip: 300 ms = 0.3 second.
plainText	true	boolean	All text contents are PlainText. If you want use format to HTML you can change this option to false
titleColor	#32c682	string	Changes the color of the title text.
titleFontSize	16px	string	Changes the font-size of the title text.
titleMaxLength	34	number	Ignores characters of the title text after the specified number.
messageColor	#1e1e1e	string	Changes the color of the message text.
messageFontSize	14px	string	Changes the font-size of the message text.
messageMaxLength	110	number	Ignores characters of the message text after the specified number.
buttonsFontSize	15px	string	Changes the font-size of the buttons text.
buttonsMaxLength	34	number	Ignores characters of the buttons text after the specified number.
okButtonColor	#f8f8f8	string	Changes the color of the OK button text.
okButtonBackground	#32c682	string	Changes the background color of the OK button.
cancelButtonColor	#f8f8f8	string	Changes the color of the CANCEL button text.
cancelButtonBackground	#a9a9a9	string	Changes the background color of the CANCEL button.

Notiflix.Confirm.Init({});

You can find the default options in an Init Function as below.


        // Notiflix Confirm - All Options

        
            Notiflix.Confirm.Init({

            className:'notiflix-confirm',
            width:'300px',
            zindex:4003,
            position:'center',
            distance:'10px',
            backgroundColor:'#f8f8f8',
            borderRadius:'25px',
            backOverlay:true,
            backOverlayColor:'rgba(0,0,0,0.5)',
            rtl:false,
            useGoogleFont:false,
            fontFamily:'Quicksand',
            cssAnimation:true,
            cssAnimationStyle:'fade',
            cssAnimationDuration:300,
            plainText:true,

            titleColor:'#32c682',
            titleFontSize:'16px',
            titleMaxLength:34,

            messageColor:'#1e1e1e',
            messageFontSize:'14px',
            messageMaxLength:110,

            buttonsFontSize:'15px',
            buttonsMaxLength:34,
            okButtonColor:'#f8f8f8',
            okButtonBackground:'#32c682',
            cancelButtonColor:'#f8f8f8',
            cancelButtonBackground:'#a9a9a9',

            });

Notiflix.Confirm.Merge({});

You can deeply extend the Init Function by using Merge Function. Examples of use are as below.

Website

global.js (Entire Website)


                // Notiflix Confirm Init - global.js

                
                    Notiflix.Confirm.Init({

                    width:'300px',
                    useGoogleFont:true,
                    fontFamily:'Quicksand',

                    });

blog.js (Blog Page)


                    // Notiflix Confirm Merge - blog.js (The Merge Function, deeply extends the Global Init only for the Blog Page.)

                    
                        Notiflix.Confirm.Merge({

                        fontFamily:'Tahoma',

                        });

Notiflix Loading All Options

You can find all the options at the table below. You can click "Code View" tab to see usages of Init and Merge

Table View Code View

Option	Default	Type	Description
className	notiflix-loading	string	Changes the class name of the Loading.
zindex	4000	number	Changes the z-index.
backgroundColor	rgba(0,0,0,0.8)	string	Changes the background color. You can use HEX, RGB or RGBA.
rtl	false	boolean	Specifies the text direction to "right-to-left".
useGoogleFont	false	boolean	The "Quicksand" font-family can be used via Google Fonts. If you want to use it you can set this option as true
fontFamily	Quicksand	string	Changes the font-family.
cssAnimation	true	boolean	Notiflix uses CSS animations to show/hide the Loading. If you don't want to use CSS animations you can set this option to false
cssAnimationDuration	400	number	Changes the CSS animations duration as milliseconds. Tip: 400 ms = 0.4 second.
clickToClose	false	boolean	If you want to remove the Loading when its clicked you can set this option to true
customSvgUrl	null	string	If you want to use your own SVG Icon you can set the URL of SVG Icon as a string format. Usage: Notiflix.Loading.Custom();
svgSize	80px	string	Changes the SVG Icons width and height. (Notiflix uses square scaled icons.)
svgColor	#32c682	string	Changes the SVG Icons color. You can use HEX, RGB or RGBA.
messageID	NotiflixLoadingMessage	string	Changes the ID (attribute) of the message text.
messageFontSize	15px	string	Changes the font-size of the message text.
messageMaxLength	34	number	Ignores characters of the message text after the specified number.
messageColor	#dcdcdc	string	Changes the color of the message text.

Notiflix.Loading.Init({});

You can find the default options in an Init Function as below.


        // Notiflix Loading - All Options

        
            Notiflix.Loading.Init({

            className:'notiflix-loading',
            zindex:4000,
            backgroundColor:'rgba(0,0,0,0.8)',
            rtl:false,
            useGoogleFont:false,
            fontFamily:'Quicksand',
            cssAnimation:true,
            cssAnimationDuration:400,
            clickToClose:false,
            customSvgUrl:null,
            svgSize:'80px',
            svgColor:'#32c682',
            messageID:'NotiflixLoadingMessage',
            messageFontSize:'15px',
            messageMaxLength:34,
            messageColor:'#dcdcdc',          

            });

Notiflix.Loading.Merge({});

You can deeply extend the Init Function by using Merge Function. Examples of use are as below.

Website

global.js (Entire Website)


                // Notiflix Loading Init - global.js

                
                    Notiflix.Loading.Init({

                    messageColor:'#fff',
                    svgSize:'100px',
                    clickToClose:true,

                    });

about.js (About Page)


                    // Notiflix Loading Merge - about.js (The Merge Function, deeply extends the Global Init only for the About Page.)

                    
                        Notiflix.Loading.Merge({

                        clickToClose:false,

                        });

Notiflix Block All Options

You can find all the options at the table below. You can click "Code View" tab to see usages of Init and Merge

Table View Code View

Option	Default	Type	Description
querySelectorLimit	200	number	Limit of the query selector NodeList length.
className	notiflix-block	string	Changes the class name of the Block module elements.
position	absolute	string	Changes the position of the Block module elements.
zindex	1000	number	Changes the z-index.
backgroundColor	rgba(255,255,255,0.9)	string	Changes the background color. You can use HEX, RGB or RGBA.
rtl	false	boolean	Specifies the text direction to "right-to-left".
useGoogleFont	false	boolean	The "Quicksand" font-family can be used via Google Fonts. If you want to use it you can set this option as true
fontFamily	Quicksand	string	Changes the font-family.
cssAnimation	true	boolean	Notiflix uses CSS animations to show/hide the Block module elements. If you don't want to use CSS animations you can set this option to false
cssAnimationDuration	300	number	Changes the CSS animations duration as milliseconds. Tip: 300 ms = 0.3 second.
svgSize	45px	string	Changes the SVG Icons width and height. (Notiflix uses square scaled icons.)
svgColor	#383838	string	Changes the SVG Icons color. You can use HEX, RGB or RGBA.
messageFontSize	14px	string	Changes the font-size of the message text.
messageMaxLength	34	number	Ignores characters of the message text after the specified number.
messageColor	#383838	string	Changes the color of the message text.

Notiflix.Block.Init({});

You can find the default options in an Init Function as below.


        // Notiflix Block - All Options

        
            Notiflix.Block.Init({

            querySelectorLimit:200,
            className:'notiflix-block',
            position:'absolute',
            zindex:1000,
            backgroundColor:'rgba(255,255,255,0.9)',
            rtl:false,
            useGoogleFont:false,
            fontFamily:'Quicksand',
            cssAnimation:true,
            cssAnimationDuration:300,
            svgSize:'45px',
            svgColor:'#383838',
            messageFontSize:'13px',
            messageMaxLength:34,
            messageColor:'#383838',          

            });

Notiflix.Block.Merge({});

You can deeply extend the Init Function by using Merge Function. Examples of use are as below.

Website

global.js (Entire Website)


                // Notiflix Block Init - global.js

                
                    Notiflix.Block.Init({

                    backgroundColor:'rgba(0,0,0,0.75)',
                    messageColor:'#fff',
                    svgSize:'100px',

                    });

dashboard.js (Dashboard Page)


                    // Notiflix Block Merge - dashboard.js (The Merge Function, deeply extends the Global Init only for the Dashboard Page.)
                    
                        Notiflix.Block.Merge({
                        svgSize:'50px',
                        });

Documentation

Notiflix Notify All Options

Notify Common Options:

Notify Success Options:

Notify Failure Options:

Notify Warning Options:

Notify Info Options:

Notiflix.Notify.Init({});

Notiflix.Notify.Merge({});

Notiflix Report All Options

Report Common Options:

Report Success Options:

Report Failure Options:

Report Warning Options:

Report Info Options:

Notiflix.Report.Init({});

Notiflix.Report.Merge({});

Notiflix Confirm All Options

Notiflix.Confirm.Init({});

Notiflix.Confirm.Merge({});

Notiflix Loading All Options

Notiflix.Loading.Init({});

Notiflix.Loading.Merge({});

Notiflix Block All Options

Notiflix.Block.Init({});

Notiflix.Block.Merge({});

Notiflix Notify Generator

Generate

Common Options:

Success Options:

Failure Options:

Warning Options:

Info Options:

Preview

Get the code

Notiflix Report Generator

Generate

Common Options:

Success Options:

Failure Options:

Warning Options:

Info Options:

Preview

Notiflix Success

Notiflix Failure

Notiflix Warning

Notiflix Info

Get the code

Notiflix Confirm Generator

Generate

Preview

Notiflix Confirm

Get the code

Notiflix Loading Generator

Generate

Preview

Get the code

Notiflix Block Generator

Generate

Preview

Albert Einstein

Get the code

Share Notiflix