Open Source
Preline Pro
Sign in
Get all access
Home
Examples
Templates
Pricing
Docs
Preline UI (Open Source)
Back to Examples
All examples
Notification Systems
Table-organized admin notification system.
Table Format List of Checkboxes
Preview
Get the code
Existing accounts: Sign in to your account to access the source code.
<!DOCTYPE html> <html lang="en" dir="" class="relative y56xt lcvuk"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <title>Preline UI</title> <link rel="shortcut icon" href="../../favicon.ico"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet"> <link rel="stylesheet" href="../../assets/css/obfuscated.min.css"> </head> <body><!-- Notifications --> <div class="cpy0y"> <!-- Header --> <div class="hidden f4gbr"> <!-- Grid --> <div class="bd993 pvgow iftta pf0ta jeqo2 h75zf"> <div class="gowp8 yrnw3"> <h2 class="a66ko i6scm dark:text-neutral-200"> Notify me about </h2> </div> <!-- End Col --> <div class="qgtgq ojv0p"> <svg class="ylm2u qdd8v yob35 daned dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="20" height="16" x="2" y="4" rx="2"/><path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"/></svg> <h3 class="huvyz ibyb7 mwwf4 i6scm dark:text-neutral-200"> Email </h3> </div> <!-- End Col --> <div class="qgtgq ojv0p"> <svg class="ylm2u qdd8v yob35 daned dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="20" height="14" x="2" y="3" rx="2"/><line x1="8" x2="16" y1="21" y2="21"/><line x1="12" x2="12" y1="17" y2="21"/></svg> <h3 class="huvyz ibyb7 mwwf4 i6scm dark:text-neutral-200"> Desktop </h3> <p class="zlgt1 daned dark:text-neutral-500"> Push notification </p> </div> <!-- End Col --> <div class="qgtgq ojv0p"> <svg class="ylm2u qdd8v yob35 daned dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="14" height="20" x="5" y="2" rx="2" ry="2"/><path d="M12 18h.01"/></svg> <h3 class="huvyz ibyb7 mwwf4 i6scm dark:text-neutral-200"> Mobile </h3> <p class="zlgt1 daned dark:text-neutral-500"> Push notification </p> </div> <!-- End Col --> </div> <!-- End Grid --> </div> <!-- End Header --> <!-- List --> <ul class="bd993 pvgow pf0ta i2ex5 klofg jeqo2 h75zf dark:bg-neutral-700"> <!-- Item --> <li class="ko0nb"> <h3 class="a66ko i6scm dark:text-neutral-200"> General </h3> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow zz16q sncqe opddz sr7qy f1l26"> <!-- Item --> <li class="ko0nb"> <p class="ibyb7 mwwf4 i6scm dark:text-neutral-200"> Mentions </p> <p class="ibyb7 daned dark:text-neutral-500"> Receive a notification if a teammate mentions you in a note. </p> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Email </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Desktop </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800"> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Mobile </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800"> </div> </div> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow zz16q sncqe opddz sr7qy f1l26"> <!-- Item --> <li class="ko0nb"> <p class="ibyb7 mwwf4 i6scm dark:text-neutral-200"> Service provider updates </p> <p class="ibyb7 daned dark:text-neutral-500"> Receive a notification when there are changes to the list of Preline service providers </p> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Email </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Desktop </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800"> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Mobile </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800"> </div> </div> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow pf0ta i2ex5 klofg jeqo2 h75zf dark:bg-neutral-700"> <!-- Item --> <li class="ko0nb"> <h3 class="a66ko i6scm dark:text-neutral-200"> API </h3> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow zz16q sncqe opddz sr7qy f1l26"> <!-- Item --> <li class="ko0nb"> <p class="ibyb7 mwwf4 i6scm dark:text-neutral-200"> Webhooks </p> <p class="ibyb7 daned dark:text-neutral-500"> Receive a notification when webhooks are consistently failing. </p> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Email </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Desktop </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800"> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Mobile </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800"> </div> </div> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow pf0ta i2ex5 klofg jeqo2 h75zf dark:bg-neutral-700"> <!-- Item --> <li class="ko0nb"> <h3 class="a66ko i6scm dark:text-neutral-200"> Tasks </h3> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow zz16q sncqe opddz sr7qy f1l26"> <!-- Item --> <li class="ko0nb"> <p class="ibyb7 mwwf4 i6scm dark:text-neutral-200"> Task Assignments </p> <p class="ibyb7 daned dark:text-neutral-500"> Notify me when I'm assigned a task </p> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Email </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Desktop </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Mobile </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow zz16q sncqe opddz sr7qy f1l26"> <!-- Item --> <li class="ko0nb"> <p class="ibyb7 mwwf4 i6scm dark:text-neutral-200"> Tasks hazq9 </p> <p class="ibyb7 daned dark:text-neutral-500"> Only for tasks youʼve created or assigned </p> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Email </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Desktop </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Mobile </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow zz16q sncqe opddz sr7qy f1l26"> <!-- Item --> <li class="ko0nb"> <p class="ibyb7 mwwf4 i6scm dark:text-neutral-200"> Tasks uncompleted </p> <p class="ibyb7 daned dark:text-neutral-500"> Only for tasks youʼve created or assigned </p> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Email </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Desktop </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Mobile </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> </ul> <!-- End List --> </div> <!-- End Notifications --> <script src="../../assets/vendor/preline/dist/index.js?v=1.0.0"></script> </body> </html>
<!-- Notifications --> <div class="cpy0y"> <!-- Header --> <div class="hidden cry5s s5hie y3vpw lx3ar dark:bg-neutral-800 f4gbr"> <!-- Grid --> <div class="bd993 pvgow iftta pf0ta jeqo2 h75zf"> <div class="gowp8 yrnw3"> <h2 class="a66ko i6scm dark:text-neutral-200"> Notify me about </h2> </div> <!-- End Col --> <div class="qgtgq ojv0p"> <svg class="ylm2u qdd8v yob35 daned dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="20" height="16" x="2" y="4" rx="2"/><path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"/></svg> <h3 class="huvyz ibyb7 mwwf4 i6scm dark:text-neutral-200"> Email </h3> </div> <!-- End Col --> <div class="qgtgq ojv0p"> <svg class="ylm2u qdd8v yob35 daned dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="20" height="14" x="2" y="3" rx="2"/><line x1="8" x2="16" y1="21" y2="21"/><line x1="12" x2="12" y1="17" y2="21"/></svg> <h3 class="huvyz ibyb7 mwwf4 i6scm dark:text-neutral-200"> Desktop </h3> <p class="zlgt1 daned dark:text-neutral-500"> Push notification </p> </div> <!-- End Col --> <div class="qgtgq ojv0p"> <svg class="ylm2u qdd8v yob35 daned dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="14" height="20" x="5" y="2" rx="2" ry="2"/><path d="M12 18h.01"/></svg> <h3 class="huvyz ibyb7 mwwf4 i6scm dark:text-neutral-200"> Mobile </h3> <p class="zlgt1 daned dark:text-neutral-500"> Push notification </p> </div> <!-- End Col --> </div> <!-- End Grid --> </div> <!-- End Header --> <!-- List --> <ul class="bd993 pvgow pf0ta i2ex5 klofg jeqo2 h75zf dark:bg-neutral-700"> <!-- Item --> <li class="ko0nb"> <h3 class="a66ko i6scm dark:text-neutral-200"> General </h3> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow zz16q sncqe opddz sr7qy f1l26"> <!-- Item --> <li class="ko0nb"> <p class="ibyb7 mwwf4 i6scm dark:text-neutral-200"> Mentions </p> <p class="ibyb7 daned dark:text-neutral-500"> Receive a notification if a teammate mentions you in a note. </p> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Email </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Desktop </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800"> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Mobile </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800"> </div> </div> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow zz16q sncqe opddz sr7qy f1l26"> <!-- Item --> <li class="ko0nb"> <p class="ibyb7 mwwf4 i6scm dark:text-neutral-200"> Service provider updates </p> <p class="ibyb7 daned dark:text-neutral-500"> Receive a notification when there are changes to the list of Preline service providers </p> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Email </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Desktop </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800"> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Mobile </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800"> </div> </div> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow pf0ta i2ex5 klofg jeqo2 h75zf dark:bg-neutral-700"> <!-- Item --> <li class="ko0nb"> <h3 class="a66ko i6scm dark:text-neutral-200"> API </h3> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow zz16q sncqe opddz sr7qy f1l26"> <!-- Item --> <li class="ko0nb"> <p class="ibyb7 mwwf4 i6scm dark:text-neutral-200"> Webhooks </p> <p class="ibyb7 daned dark:text-neutral-500"> Receive a notification when webhooks are consistently failing. </p> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Email </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Desktop </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800"> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Mobile </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800"> </div> </div> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow pf0ta i2ex5 klofg jeqo2 h75zf dark:bg-neutral-700"> <!-- Item --> <li class="ko0nb"> <h3 class="a66ko i6scm dark:text-neutral-200"> Tasks </h3> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> <!-- Item --> <li class="hidden f4gbr xayxp icg7c"> <button type="button" class="zlgt1 w3gzo cp4xc v91gt mwwf4 wh5re dlixe dark:text-blue-400 dark:hover:text-blue-500"> Toggle all </button> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow zz16q sncqe opddz sr7qy f1l26"> <!-- Item --> <li class="ko0nb"> <p class="ibyb7 mwwf4 i6scm dark:text-neutral-200"> Task Assignments </p> <p class="ibyb7 daned dark:text-neutral-500"> Notify me when I'm assigned a task </p> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Email </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Desktop </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Mobile </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow zz16q sncqe opddz sr7qy f1l26"> <!-- Item --> <li class="ko0nb"> <p class="ibyb7 mwwf4 i6scm dark:text-neutral-200"> Tasks hazq9 </p> <p class="ibyb7 daned dark:text-neutral-500"> Only for tasks youʼve created or assigned </p> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Email </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Desktop </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Mobile </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> </ul> <!-- End List --> <!-- List --> <ul class="bd993 pvgow zz16q sncqe opddz sr7qy f1l26"> <!-- Item --> <li class="ko0nb"> <p class="ibyb7 mwwf4 i6scm dark:text-neutral-200"> Tasks uncompleted </p> <p class="ibyb7 daned dark:text-neutral-500"> Only for tasks youʼve created or assigned </p> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Email </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Desktop </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> <!-- Item --> <li class="qgtgq"> <div class="bd993 mpjax items-center f4gbr"> <span class="duftn ibyb7 daned dark:text-neutral-200"> Mobile </span> <div class="cst3m icg7c"> <input type="checkbox" class="ylm2u yuuoo e4ige w3gzo o6r86 j01y2 otank dark:bg-neutral-800 dark:border-neutral-600 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800" checked> </div> </div> </li> <!-- End Item --> </ul> <!-- End List --> </div> <!-- End Notifications -->
Subscribe
Get all the latest Preline updates and news.
All examples
Close
Close