Laravel Nova - Beautifully-designed administration panel for Laravel

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"/> <meta http-equiv="X-UA-Compatible" content="IE=edge"/> <meta name="viewport" content="width=device-width, initial-scale=1"/> <title> Laravel Nova - Beautifully-designed administration panel for Laravel </title>  <link rel="alternate" type="application/atom+xml" href="https://nova.laravel.com/releases/feed.atom" title="Laravel Nova Releases">  <style >/* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 200; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnaors7nczihnhi.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 200; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnahrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 200; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnamrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 200; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnanrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 200; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnadrs7nczih.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 300; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnaors7nczihnhi.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 300; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnahrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 300; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnamrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 300; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnanrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 300; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnadrs7nczih.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 400; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnaors7nczihnhi.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 400; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnahrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 400; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnamrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 400; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnanrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 400; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnadrs7nczih.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 500; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnaors7nczihnhi.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 500; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnahrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 500; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnamrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 500; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnanrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 500; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnadrs7nczih.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 600; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnaors7nczihnhi.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 600; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnahrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 600; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnamrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 600; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnanrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 600; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnadrs7nczih.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 700; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnaors7nczihnhi.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 700; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnahrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 700; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnamrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 700; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnanrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 700; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnadrs7nczih.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 800; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnaors7nczihnhi.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 800; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnahrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 800; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnamrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 800; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnanrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 800; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnadrs7nczih.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 900; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnaors7nczihnhi.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 900; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnahrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 900; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnamrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 900; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnanrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 900; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnadrs7nczih.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 1000; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnaors7nczihnhi.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 1000; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnahrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 1000; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnamrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 1000; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnanrs7nczihnhi.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 1000; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxx3i6li01bkofimnadrs7nczih.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 200; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiooabtmnfcqig.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 200; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofimeabtmnfcqig.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 200; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiouabtmnfcqig.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 200; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofio-abtmnfcqig.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 200; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofineabtmnfcq.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 300; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiooabtmnfcqig.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 300; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofimeabtmnfcqig.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 300; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiouabtmnfcqig.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 300; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofio-abtmnfcqig.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 300; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofineabtmnfcq.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiooabtmnfcqig.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofimeabtmnfcqig.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiouabtmnfcqig.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofio-abtmnfcqig.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofineabtmnfcq.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 500; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiooabtmnfcqig.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 500; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofimeabtmnfcqig.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 500; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiouabtmnfcqig.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 500; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofio-abtmnfcqig.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 500; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofineabtmnfcq.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 600; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiooabtmnfcqig.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 600; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofimeabtmnfcqig.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 600; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiouabtmnfcqig.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 600; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofio-abtmnfcqig.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 600; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofineabtmnfcq.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 700; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiooabtmnfcqig.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 700; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofimeabtmnfcqig.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 700; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiouabtmnfcqig.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 700; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofio-abtmnfcqig.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 700; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofineabtmnfcq.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 800; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiooabtmnfcqig.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 800; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofimeabtmnfcqig.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 800; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiouabtmnfcqig.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 800; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofio-abtmnfcqig.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 800; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofineabtmnfcq.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 900; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiooabtmnfcqig.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 900; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofimeabtmnfcqig.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 900; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiouabtmnfcqig.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 900; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofio-abtmnfcqig.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 900; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofineabtmnfcq.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 1000; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiooabtmnfcqig.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 1000; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofimeabtmnfcqig.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 1000; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofiouabtmnfcqig.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 1000; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofio-abtmnfcqig.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 1000; font-display: swap; src: url(https://nova.laravel.com/storage/fonts/e449a7a618/snunitov26xrxv3i6li01bkofineabtmnfcq.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } </style>  <link href="/css/app.css?id=5b5dc15cc1b3678981e30b1daa61d17b" rel="stylesheet"/>  <script defer src="https://cdn.jsdelivr.net/npm/@alpinejs/focus@3.x.x/dist/cdn.min.js"></script> <script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script> <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"/> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"/> <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"/> <link rel="manifest" href="/site.webmanifest"/> <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5"/> <meta name="msapplication-TileColor" content="#da532c"/>  <script> (function(d, script) { script = d.createElement('script'); script.async = false; script.onload = function (){ Plain.init({ appId: 'liveChatApp_01JDPPAPQS2V6A8FH59N33PHDY', links: [ { icon: 'book', text: 'View our docs', url: 'https://nova.laravel.com/docs', }, { icon: 'discord', text: 'Join our Discord', url: 'https://discord.com/invite/laravel', } ], style: { brandColor: '#00E1FF', chatButtonColor: '#00E1FF', chatButtonIconColor: '#ffffff', }, threadDetails: { labelTypeIds: ['lt_01JAZTMNYM3EQVS854CK6JKAA9'], }, theme: 'auto', position: { right: '25px', bottom: '25px', }, requireAuthentication: true, chatButtons: [ { icon: 'chat', text: 'Ask a question', threadDetails: { labelTypeIds: ['lt_01JD7S0WAJGF5215238S62F82V'], }, }, { icon: 'bulb', text: 'Send feedback', threadDetails: { labelTypeIds: ['lt_01JD7S1HJ38125D0QGE3FQ8HRT'], }, }, { icon: 'error', text: 'Report an issue', threadDetails: { labelTypeIds: ['lt_01JD7S15A3HAD7PM8X8AR4BD9N'], }, }, ], }); }; script.src = 'https://chat.cdn-plain.com/index.js'; d.getElementsByTagName('head')[0].appendChild(script); }(document)); </script> </head> <body class="bg-white font-marketing text-gray-400 antialiased dark:bg-gray-800"> <div class="relative"> <div class="absolute inset-0 from-gray-900 to-gray-800 dark:bg-gradient-to-tl"></div> <div class="absolute inset-0 h-full w-full bg-cover bg-no-repeat opacity-[0.1] dark:opacity-100" style="background-image: url('/img/background-lines.svg')" ></div> <div class="relative"> <header x-data="{ navIsOpen: false }" class="mx-auto flex max-w-7xl items-center justify-between gap-4 px-8 pb-12 pt-6 sm:py-12" > <div> <a href="/" class="inline-flex rounded-sm transition hover:opacity-80 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50" > <span class="sr-only">Laravel Nova</span> <svg class="h-8 md:h-10" viewBox="0 0 204 37" xmlns="http://www.w3.org/2000/svg" > <defs> <radialGradient cx="-4.619%" cy="6.646%" fx="-4.619%" fy="6.646%" r="101.342%" gradientTransform="matrix(.8299 .53351 -.5579 .79363 .03 .038)" id="a" > <stop stop-color="#00FFC4" offset="0%"/> <stop stop-color="#00E1FF" offset="100%"/> </radialGradient> </defs> <g fill-rule="nonzero" fill="none"> <path d="M30.343 9.99a14.757 14.757 0 0 1 .046 20.972 18.383 18.383 0 0 1-13.019 5.365A18.382 18.382 0 0 1 3.272 29.79c7.209 5.955 17.945 5.581 24.713-1.118a11.477 11.477 0 0 0 0-16.345c-4.56-4.514-11.953-4.514-16.513 0a4.918 4.918 0 0 0 0 7.006 5.04 5.04 0 0 0 7.077 0 1.68 1.68 0 0 1 2.359 0 1.639 1.639 0 0 1 0 2.333 8.4 8.4 0 0 1-11.794 0 8.198 8.198 0 0 1 0-11.674c5.861-5.805 15.366-5.805 21.229 0ZM17.37 0a18.38 18.38 0 0 1 14.097 6.538C24.257.583 13.52.958 6.756 7.653v.002a11.477 11.477 0 0 0 0 16.346c4.558 4.515 11.95 4.515 16.51 0a4.918 4.918 0 0 0 0-7.005 5.04 5.04 0 0 0-7.077 0 1.68 1.68 0 0 1-2.358 0 1.639 1.639 0 0 1 0-2.334 8.4 8.4 0 0 1 11.794 0 8.198 8.198 0 0 1 0 11.674c-5.862 5.805-15.367 5.805-21.23 0a14.756 14.756 0 0 1-.02-20.994A18.383 18.383 0 0 1 17.37 0Z" fill="url(#a)" /> <path d="M59.211 27.49a1.68 1.68 0 0 0 1.69-1.69 1.68 1.68 0 0 0-1.69-1.69h-6.88V12.306c0-1.039-.82-1.86-1.86-1.86-1.037 0-1.858.821-1.858 1.86v13.325c0 1.039.82 1.858 1.859 1.858h8.74Zm9.318-13.084c2.004 0 3.453.531 4.37 1.448.965.967 1.4 2.39 1.4 4.13v5.888c0 .99-.798 1.763-1.787 1.763-1.062 0-1.763-.749-1.763-1.52v-.026c-.893.99-2.123 1.642-3.91 1.642-2.438 0-4.441-1.4-4.441-3.959v-.048c0-2.824 2.148-4.128 5.214-4.128a9.195 9.195 0 0 1 3.163.532v-.218c0-1.521-.944-2.366-2.777-2.366a8.416 8.416 0 0 0-2.535.361 1.525 1.525 0 0 1-.53.098c-.846 0-1.521-.652-1.521-1.496 0-.635.394-1.203.989-1.425 1.16-.435 2.414-.676 4.128-.676Zm-.05 7.387c-1.567 0-2.533.628-2.533 1.786v.047c0 .99.821 1.57 2.005 1.57h-.001l.195-.004c1.541-.066 2.59-.915 2.672-2.113l.005-.151v-.653c-.628-.289-1.448-.482-2.342-.482Zm10.817 5.842c1.014 0 1.833-.82 1.833-1.835v-3.428c0-2.607 1.04-4.03 2.898-4.465.748-.17 1.375-.75 1.375-1.714 0-1.04-.652-1.787-1.785-1.787-1.088 0-1.956 1.159-2.486 2.415v-.58a1.835 1.835 0 1 0-3.67 0v9.56c0 1.013.82 1.833 1.833 1.833l.002.001Zm13.01-13.229c2.005 0 3.453.531 4.37 1.448.965.967 1.4 2.39 1.4 4.13v5.888c0 .99-.797 1.763-1.786 1.763-1.063 0-1.763-.749-1.763-1.52v-.026c-.893.99-2.123 1.643-3.911 1.643-2.438-.001-4.44-1.401-4.44-3.96v-.048c0-2.824 2.148-4.128 5.214-4.128a9.195 9.195 0 0 1 3.162.532v-.218c0-1.521-.943-2.366-2.776-2.366a8.416 8.416 0 0 0-2.535.361 1.525 1.525 0 0 1-.53.098c-.847 0-1.522-.652-1.522-1.496 0-.635.395-1.203.99-1.425 1.16-.435 2.413-.676 4.127-.676Zm-.048 7.387c-1.568 0-2.534.628-2.534 1.786v.047c0 .99.821 1.57 2.003 1.57 1.714 0 2.872-.94 2.872-2.268v-.653c-.627-.289-1.447-.482-2.341-.482Zm14.17 5.963c.99 0 1.667-.653 2.076-1.593l3.959-9.15c.072-.169.194-.555.194-.869a1.736 1.736 0 0 0-1.764-1.738c-.965 0-1.472.628-1.712 1.255l-2.825 7.556-2.775-7.508c-.267-.748-.798-1.303-1.788-1.303-.989 0-1.786.845-1.786 1.714 0 .338.097.652.194.894l3.959 9.149c.41.965 1.086 1.593 2.075 1.593h.194-.001Zm13.977-13.447c4.321 0 6.228 3.55 6.228 6.228 0 1.063-.748 1.763-1.714 1.763h-7.265c.362 1.665 1.52 2.535 3.162 2.535a4.237 4.237 0 0 0 2.607-.87 1.37 1.37 0 0 1 .894-.29c.82 0 1.423.63 1.423 1.449 0 .483-.216.846-.483 1.086-1.134.967-2.607 1.57-4.49 1.57-3.886 0-6.758-2.728-6.758-6.687v-.047c0-3.695 2.63-6.737 6.396-6.737Zm0 2.945c-1.52 0-2.51 1.086-2.8 2.753h5.528c-.217-1.642-1.183-2.753-2.728-2.753Zm11.033 10.381c1.014 0 1.833-.82 1.833-1.835V11.556a1.834 1.834 0 0 0-3.668 0V25.8c0 1.014.82 1.833 1.833 1.833l.002.003Zm14.75 0c1.013 0 1.833-.82 1.833-1.835v-9.053l7.435 9.753c.507.653 1.039 1.086 1.93 1.086h.123c1.037 0 1.858-.82 1.858-1.858V12.283a1.835 1.835 0 0 0-3.67 0v8.713l-7.17-9.415c-.505-.651-1.037-1.086-1.93-1.086h-.386c-1.038 0-1.859.821-1.859 1.859v13.445c0 1.014.82 1.836 1.834 1.836h.001Zm23.244-13.326c4.007 0 6.976 2.97 6.976 6.687v.048c0 3.719-2.993 6.735-7.024 6.735-4.007 0-6.976-2.97-6.976-6.686v-.047c0-3.719 2.993-6.737 7.024-6.737Zm-.048 3.163c-2.1 0-3.355 1.617-3.355 3.524v.048c0 1.907 1.375 3.573 3.403 3.573 2.1 0 3.355-1.617 3.355-3.524v-.049c0-1.905-1.375-3.572-3.403-3.572Zm14.798 10.284c.99 0 1.664-.653 2.076-1.593l3.958-9.15c.072-.169.195-.555.195-.869a1.736 1.736 0 0 0-1.764-1.738c-.966 0-1.473.628-1.713 1.255l-2.825 7.556-2.777-7.508c-.264-.748-.796-1.303-1.786-1.303-.989 0-1.786.845-1.786 1.714 0 .338.097.652.194.894l3.959 9.149c.41.965 1.086 1.593 2.075 1.593h.194Zm13.76-13.35c2.003 0 3.451.531 4.368 1.448.967.967 1.4 2.39 1.4 4.13v5.888c0 .99-.796 1.763-1.786 1.763-1.061 0-1.761-.749-1.761-1.52v-.026c-.894.99-2.126 1.642-3.91 1.642-2.44 0-4.444-1.4-4.444-3.959v-.048c0-2.824 2.149-4.128 5.215-4.128a9.195 9.195 0 0 1 3.162.532v-.218c0-1.521-.942-2.366-2.776-2.366a8.416 8.416 0 0 0-2.535.361 1.52 1.52 0 0 1-.53.098c-.845 0-1.522-.652-1.522-1.496 0-.636.395-1.204.99-1.425 1.159-.435 2.415-.676 4.129-.676Zm-.049 7.387c-1.57 0-2.535.628-2.535 1.786v.047c0 .99.821 1.57 2.004 1.57 1.714 0 2.873-.94 2.873-2.268v-.653c-.628-.289-1.449-.482-2.342-.482Z" class="fill-current text-gray-600 dark:text-white" /> </g> </svg> </a> </div> <nav class="hidden md:flex md:items-center md:gap-5 lg:gap-8"> <a href="/releases" class="rounded-sm text-gray-600 transition-colors hover:text-gray-400 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50 dark:text-gray-400 dark:hover:text-white" > Releases </a> <a href="/docs" class="rounded-sm text-gray-600 transition-colors hover:text-gray-400 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50 dark:text-gray-400 dark:hover:text-white" > Documentation </a> <a href="/#pricing" class="rounded-sm text-gray-600 transition-colors hover:text-gray-400 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50 dark:text-gray-400 dark:hover:text-white" > Pricing </a> </nav> <div class="hidden md:flex md:items-center md:gap-8"> <a href="/login" class="rounded-sm text-gray-600 transition-colors hover:text-gray-400 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50 dark:text-gray-400 dark:hover:text-white" > Login </a> <a href="/register" class="inline-flex items-center rounded-lg border border-transparent bg-gradient-to-r from-green-300 to-blue-green-300 px-6 py-2.5 font-semibold text-gray-900 transition hover:opacity-80 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50" > Register </a> </div> <button class="md:hidden" @click="navIsOpen = true"> <span class="sr-only">Show navigation</span> <svg class="h-6 w-6 text-gray-600 dark:text-white" aria-hidden="true" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" > <path d="M4 18h16M4 6h16H4Zm0 6h16H4Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" /> </svg> </button> <div @keyup.escape.prevent.stop="navIsOpen = false" x-show="navIsOpen" style="display: none" x-transition.opacity x-trap.inert.noscroll="navIsOpen" class="fixed inset-0 z-50 min-h-screen w-full md:hidden" >  <div x-show="navIsOpen" x-transition.opacity.300ms class="fixed inset-0 bg-gray-900 bg-opacity-75" ></div>  <div x-show="navIsOpen" role="dialog" x-transition.300ms class="relative h-full w-full p-6" > <div class="relative overflow-y-auto rounded-xl border-gray-600/30 bg-gray-800 p-12" @click.away="navIsOpen = false" > <button class="absolute right-4 top-4 inline-flex h-10 w-10 items-center justify-center rounded-lg bg-gray-900 text-white" @click="navIsOpen = false" > <svg class="h-6 w-6" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round" class="css-i6dzq1" > <line x1="18" y1="6" x2="6" y2="18"></line> <line x1="6" y1="6" x2="18" y2="18"></line> </svg> </button> <nav class="space-y-4"> <div> <a href="/releases" class="font-medium text-white"> Releases </a> </div> <div> <a href="/docs" class="font-medium text-white"> Documentation </a> </div> <div> <a href="/#pricing" class="font-medium text-white" @click.prevent="navIsOpen = false; setTimeout(() => scrollTo({ top: document.getElementById('pricing').offsetTop - 40, behavior: 'smooth' }), 400)" > Pricing </a> </div> </nav> </div> </div> </div> </header> <main> <section class="relative flex max-w-7xl flex-col gap-12 md:mt-10 md:block md:max-w-none" > <div class="md:absolute md:flex md:h-full md:w-full md:items-center"> <div class="px-8 md:mx-auto md:w-full md:max-w-7xl"> <div class="md:w-3/5 md:pr-8 xl:w-1/2 xl:pr-12"> <h1 class="text-5xl font-bold text-gray-800 dark:text-white md:text-6xl lg:text-7xl xl:text-[100px]" > Master your <br/> <span class="inline-block bg-gradient-to-r from-blue-green-400 to-green-300 bg-clip-text text-transparent" > universe. </span> </h1> <p class="mt-8 text-lg font-medium text-gray-600 dark:text-gray-400" > Nova is the simplest and fastest way to build production-ready administration panels using Laravel. Simply <code class="text-base font-semibold text-gray-800 dark:text-gray-300">composer require laravel/nova</code>, <code class="text-base font-semibold text-gray-800 dark:text-gray-300">nova:install</code>, and you're ready to go. </p> <div class="mt-8 flex flex-col gap-4 sm:flex-row sm:items-center sm:gap-6" > <a href="/register" class="inline-flex w-full items-center justify-center rounded-lg border border-transparent bg-gradient-to-br from-green-300 to-blue-green-300 px-6 py-3.5 text-center font-semibold text-gray-900 transition hover:opacity-80 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50 sm:w-auto sm:px-8" > Buy a license </a> <a href="/docs" class="inline-flex w-full items-center justify-center rounded-lg border border-transparent bg-gray-900 px-6 py-3.5 text-center font-semibold text-white transition hover:opacity-80 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50 sm:w-auto sm:px-8" > Read the docs </a> </div> </div> </div> </div> <div class="flex w-full justify-end"> <div class="relative overflow-hidden pl-8 md:w-2/5 md:pl-0 xl:w-1/2 xl:pl-16" x-data="{ modalIsOpen: false }" > <div class="relative"> <img class="hidden max-w-none rounded-xl border-2 border-gray-200 md:block dark:md:hidden" width="1008" src="/img/laravel-nova-mockup-light.png" /> <img class="max-w-none rounded-xl border-2 border-gray-200 dark:hidden md:hidden" width="720" src="/img/laravel-nova-mockup-light.png" /> <img class="hidden max-w-none rounded-xl border-2 border-transparent dark:hidden dark:md:block" width="1008" src="/img/laravel-nova-mockup-dark.png" /> <img class="hidden max-w-none rounded-xl border-2 border-transparent dark:block dark:md:hidden" width="720" src="/img/laravel-nova-mockup-dark.png" /> <button type="button" @click="modalIsOpen = true" href="https://youtu.be/BMvMBAnRrJQ" class="absolute bottom-px left-px inline-flex items-center justify-center gap-4 rounded-bl-xl rounded-tr-xl border border-transparent bg-gradient-to-br from-green-300 to-blue-green-300 px-6 py-3 text-center font-semibold text-gray-900 transition hover:opacity-80 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50 sm:py-4 lg:py-5 lg:text-lg" > <img src="/icons/play.svg" alt="Play" class="h-10 w-10 drop-shadow-md sm:h-12 sm:w-12" /> <span>Take the video tour</span> </button> </div>  <div @keyup.escape.document="modalIsOpen = false" x-show="modalIsOpen" x-transition:enter="transition ease-out duration-300" x-transition:enter-start="opacity-0" x-transition:enter-end="opacity-100" x-transition:leave="transition ease-in duration-300" x-transition:leave-start="opacity-100" x-transition:leave-end="opacity-0" x-trap.inert.noscroll="modalIsOpen" role="dialog" class="fixed inset-0 p-6 flex items-center justify-center z-[99999]" >  <div class="relative w-full max-w-5xl z-50" > <template x-if="modalIsOpen"> <iframe class="w-full aspect-video" src="https://www.youtube.com/embed/BMvMBAnRrJQ?si=-6TBGdyqvJBnhWQU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe> </template> </div>  <div class="fixed inset-0 bg-gray-900/90 z-40" @click="modalIsOpen = false" ></div> </div> </div> </div> </section> <section class="relative py-24 lg:py-32"> <div class="absolute inset-0 flex flex-col"> <div class="mt-auto h-1/2 w-full bg-[#EAF4FC] dark:bg-[#15263c]"></div> </div> <div class="mx-auto w-full max-w-2xl px-8 lg:max-w-7xl"> <div class="relative grid items-center gap-12 overflow-hidden rounded-xl bg-gray-800 bg-[url('/img/bars.svg')] bg-[length:640px] bg-right-bottom bg-no-repeat px-8 py-12 dark:bg-gray-900 md:p-20 lg:grid-cols-2" > <div class="relative"> <img src="/icons/lightning.svg" class="h-16 w-16" loading="lazy" /> <h2 class="mt-6 text-3xl font-semibold text-white sm:text-4xl md:text-5xl/tight xl:text-6xl/tight" > Craft complete backends in <span class="inline-block bg-gradient-to-r from-blue-green-400 to-green-300 bg-clip-text text-transparent" > minutes. </span> </h2> <p class="mt-6 font-medium text-gray-400 sm:text-lg"> Nova allows you to create beautiful, easy-to-use, and complete application backends that handle all of your needs. </p> <p class="mt-4 font-medium text-gray-400 sm:text-lg"> Gone are the days of cobbling together lackluster administration panels. Nova is designed and crafted by the Laravel team, so it integrates perfectly with the framework. </p> <p class="mt-4 font-medium text-gray-400 sm:text-lg"> Nova is the easiest way to quickly manage your data, view your key application metrics, or handle any custom process your application requires. </p> </div> <div class="relative"> <div class="aspect-[4/5] w-[240px] rounded-xl bg-gray-900 dark:border-gray-900 dark:bg-gray-800 sm:w-[320px] overflow-hidden" > <img class="dark:hidden object-cover" src="/img/collage-form.png"/> <img class="hidden dark:block object-cover" src="/img/collage-form-dark.png"/> </div> <div class="absolute right-0 top-56 aspect-[5/4] w-[240px] rounded-xl bg-gray-900 dark:border-gray-900 dark:bg-gray-800 sm:top-64 sm:w-[320px] md:-right-8 lg:top-64 overflow-hidden" > <img class="dark:hidden object-cover" src="/img/collage-metric.png"/> <img class="hidden dark:block object-cover" src="/img/collage-metric-dark.png"/> </div> <div class="relative ml-4 mt-12 aspect-[4/3] w-[220px] rounded-xl bg-gray-900 dark:border-gray-900 dark:bg-gray-800 sm:ml-12 sm:w-[240px] md:ml-24 overflow-hidden" > <img class="dark:hidden object-cover" src="/img/collage-index.png"/> <img class="hidden dark:block object-cover" src="/img/collage-index-dark.png"/> </div> </div> </div> </div> </section> <section class="bg-gradient-to-b from-[#EAF4FC] to-transparent dark:from-[#15263c]"> <div class="mx-auto w-full max-w-2xl px-8 lg:max-w-7xl"> <div class="text-center"> <h2 class="text-4xl font-bold text-gray-900 dark:text-white md:text-5xl/tight lg:text-6xl/tight" > Out of this world features </h2> <p class="mx-auto mt-6 max-w-2xl text-gray-600 dark:text-gray-400 sm:text-lg"> Resource management, actions, filters, lenses, metrics, and more. You can use Nova to easily craft a powerful, robust backend administration panel in minutes. </p> </div> <div class="mt-12 grid gap-8 lg:grid-cols-2"> <div class="relative flex flex-col items-center rounded-xl border border-gray-400/30 px-10 pt-10 text-center dark:border-gray-600/20 lg:flex-row lg:gap-6 lg:px-0 lg:py-16 lg:text-left lg:col-span-2 bg-white dark:bg-gray-900" > <div class="absolute inset-0 dark:opacity-20 sm:bg-[url(/img/bars-2.svg)] sm:bg-right-top sm:bg-no-repeat md:bg-[length:480px]" ></div> <div class="relative lg:p-10 lg:pl-20"> <div class="inline-flex h-16 w-16 items-center justify-center rounded-full border-2 border-gray-800 bg-gray-800 shadow-lg sm:h-20 sm:w-20" > <img src="/icons/resource-management.svg" class="h-8 w-8 drop-shadow sm:h-10 sm:w-10" /> </div> <h3 class="mt-6 text-3xl font-bold text-gray-900 dark:text-white sm:mt-6 sm:text-4xl xl:text-[40px]" > Resource Management </h3> <p class="mt-4 max-w-xl text-gray-700 dark:text-gray-400 sm:mt-6 lg:text-lg"> Nova provides a full CRUD interface for your Eloquent models. Every type of Eloquent relationship is fully supported. Need to edit the pivot data on your polymorphic many-to-many relationship? We have you covered. </p> </div> <div class="relative flex w-full flex-1 items-end pt-12 lg:block lg:!w-[51%] lg:flex-auto lg:shrink-0 lg:pt-0" > <div class="h-[240px] w-full rounded-t-xl border-l border-r border-t border-gray-400/30 bg-gray-50 dark:border-gray-600/20 flex overflow-hidden lg:h-[616px] lg:rounded-l-xl lg:rounded-tr-none lg:border-b lg:border-r-0 bg-gray-100 dark:bg-gray-800" > <img class="dark:hidden object-cover" src="/img/feature-resource-management.png" /> <img class="hidden dark:block object-cover" src="/img/feature-resource-management-dark.png" /> </div> </div> </div> <div class="relative flex flex-col items-center rounded-xl border border-gray-400/30 px-10 pt-10 text-center dark:border-gray-600/20 bg-white dark:bg-gray-900" > <div class="absolute inset-0 dark:opacity-20" ></div> <div class="relative"> <div class="inline-flex h-16 w-16 items-center justify-center rounded-full border-2 border-gray-800 bg-gray-800 shadow-lg sm:h-20 sm:w-20" > <img src="/icons/actions.svg" class="h-8 w-8 drop-shadow sm:h-10 sm:w-10" /> </div> <h3 class="mt-6 text-3xl font-bold text-gray-900 dark:text-white sm:mt-6 sm:text-4xl xl:text-[40px]" > Actions </h3> <p class="mt-4 max-w-xl text-gray-700 dark:text-gray-400 sm:mt-6 lg:text-lg"> Actions are PHP tasks you can run against a resource or batch of resources. Have an action that takes a while? No problem, Nova’s queued actions will keep your administration panel feeling snappy. </p> </div> <div class="relative flex w-full flex-1 items-end pt-12" > <div class="h-[240px] w-full rounded-t-xl border-l border-r border-t border-gray-400/30 bg-gray-50 dark:border-gray-600/20 flex overflow-hidden bg-gray-100 dark:bg-gray-800" > <img class="dark:hidden object-cover" src="/img/feature-actions.png" /> <img class="hidden dark:block object-cover" src="/img/feature-actions-dark.png" /> </div> </div> </div> <div class="relative flex flex-col items-center rounded-xl border border-gray-400/30 px-10 pt-10 text-center dark:border-gray-600/20 bg-gray-100 dark:bg-gray-900" > <div class="absolute inset-0 dark:opacity-20 bg-[url(/img/dots.svg)] bg-[length:94%] bg-bottom bg-no-repeat" ></div> <div class="relative"> <div class="inline-flex h-16 w-16 items-center justify-center rounded-full border-2 border-gray-800 bg-gray-800 shadow-lg sm:h-20 sm:w-20" > <img src="/icons/filters.svg" class="h-8 w-8 drop-shadow sm:h-10 sm:w-10" /> </div> <h3 class="mt-6 text-3xl font-bold text-gray-900 dark:text-white sm:mt-6 sm:text-4xl xl:text-[40px]" > Filters </h3> <p class="mt-4 max-w-xl text-gray-700 dark:text-gray-400 sm:mt-6 lg:text-lg"> Write custom filters to offer users a quick glance at different segments of your data. To get you started, we’ve included built-in filters for “soft deleted” resources. </p> </div> <div class="relative flex w-full flex-1 items-end pt-12" > <div class="h-[240px] w-full rounded-t-xl border-l border-r border-t border-gray-400/30 bg-gray-50 dark:border-gray-600/20 flex overflow-hidden bg-white dark:bg-gray-800" > <img class="dark:hidden object-cover" src="/img/feature-filters.png" /> <img class="hidden dark:block object-cover" src="/img/feature-filters-dark.png" /> </div> </div> </div> <div class="relative flex flex-col items-center rounded-xl border border-gray-400/30 px-10 pt-10 text-center dark:border-gray-600/20 lg:col-span-2 lg:pt-20 bg-white dark:bg-gray-900" > <div class="absolute inset-0 dark:opacity-20 sm:bg-[url(/img/bars-3.svg)] sm:bg-left-bottom sm:bg-no-repeat md:bg-[length:480px]" ></div> <div class="relative"> <div class="inline-flex h-16 w-16 items-center justify-center rounded-full border-2 border-gray-800 bg-gray-800 shadow-lg sm:h-20 sm:w-20" > <img src="/icons/lenses.svg" class="h-8 w-8 drop-shadow sm:h-10 sm:w-10" /> </div> <h3 class="mt-6 text-3xl font-bold text-gray-900 dark:text-white sm:mt-6 sm:text-4xl xl:text-[40px]" > Lenses </h3> <p class="mt-4 max-w-xl text-gray-700 dark:text-gray-400 sm:mt-6 lg:text-lg"> Need to dig into a specialized view of your resources? No problem. Add lenses to your resource to take full control over the entire Eloquent query used to retrieve your data. </p> </div> <div class="relative flex w-full flex-1 items-end pt-12" > <div class="h-[240px] w-full rounded-t-xl border-l border-r border-t border-gray-400/30 bg-gray-50 dark:border-gray-600/20 flex overflow-hidden lg:mx-auto lg:h-[600px] lg:w-[85%] bg-gray-100 dark:bg-gray-800" > <img class="dark:hidden object-cover" src="/img/feature-lenses.png" /> <img class="hidden dark:block object-cover" src="/img/feature-lenses-dark.png" /> </div> </div> </div> <div class="relative flex flex-col items-center rounded-xl border border-gray-400/30 px-10 pt-10 text-center dark:border-gray-600/20 lg:flex-row lg:gap-6 lg:px-0 lg:py-16 lg:text-left lg:col-span-2 bg-white dark:bg-gray-900" > <div class="absolute inset-0 dark:opacity-20 sm:bg-[url(/img/bars-2.svg)] sm:bg-right-top sm:bg-no-repeat md:bg-[length:480px]" ></div> <div class="relative lg:p-10 lg:pl-20"> <div class="inline-flex h-16 w-16 items-center justify-center rounded-full border-2 border-gray-800 bg-gray-800 shadow-lg sm:h-20 sm:w-20" > <img src="/icons/custom-tools.svg" class="h-8 w-8 drop-shadow sm:h-10 sm:w-10" /> </div> <h3 class="mt-6 text-3xl font-bold text-gray-900 dark:text-white sm:mt-6 sm:text-4xl xl:text-[40px]" > Custom Tools </h3> <p class="mt-4 max-w-xl text-gray-700 dark:text-gray-400 sm:mt-6 lg:text-lg"> Nova offers CLI generators for scaffolding your own custom tools. We’ll give you a Vue component and infinite possibilities. Build the custom tools your business requires, or build the next great Nova add-on and share it with the world. </p> </div> <div class="relative flex w-full flex-1 items-end pt-12 lg:block lg:!w-[51%] lg:flex-auto lg:shrink-0 lg:pt-0" > <div class="h-[240px] w-full rounded-t-xl border-l border-r border-t border-gray-400/30 bg-gray-50 dark:border-gray-600/20 flex overflow-hidden lg:h-[616px] lg:rounded-l-xl lg:rounded-tr-none lg:border-b lg:border-r-0 bg-gray-100 dark:bg-gray-800" > <img class="dark:hidden object-cover" src="/img/feature-custom-tools.png" /> <img class="hidden dark:block object-cover" src="/img/feature-custom-tools-dark.png" /> </div> </div> </div> <div class="relative flex flex-col items-center rounded-xl border border-gray-400/30 px-10 pt-10 text-center dark:border-gray-600/20 bg-white dark:bg-gray-900" > <div class="absolute inset-0 dark:opacity-20 bg-[url(/img/dots.svg)] bg-[length:94%] bg-bottom bg-no-repeat" ></div> <div class="relative"> <div class="inline-flex h-16 w-16 items-center justify-center rounded-full border-2 border-gray-800 bg-gray-800 shadow-lg sm:h-20 sm:w-20" > <img src="/icons/metrics.svg" class="h-8 w-8 drop-shadow sm:h-10 sm:w-10" /> </div> <h3 class="mt-6 text-3xl font-bold text-gray-900 dark:text-white sm:mt-6 sm:text-4xl xl:text-[40px]" > Metrics </h3> <p class="mt-4 max-w-xl text-gray-700 dark:text-gray-400 sm:mt-6 lg:text-lg"> Nova makes it painless to quickly display custom metrics for your application, allowing you to generate three types of graphs in seconds. To put the cherry on top, we’ve included query helpers so it's all easy as pie. </p> </div> <div class="relative flex w-full flex-1 items-end pt-12" > <div class="h-[240px] w-full rounded-t-xl border-l border-r border-t border-gray-400/30 bg-gray-50 dark:border-gray-600/20 flex overflow-hidden bg-gray-100 dark:bg-gray-800" > <img class="dark:hidden object-cover" src="/img/feature-metrics.png" /> <img class="hidden dark:block object-cover" src="/img/feature-metrics-dark.png" /> </div> </div> </div> <div class="relative flex flex-col items-center rounded-xl border border-gray-400/30 px-10 pt-10 text-center dark:border-gray-600/20 bg-gray-100 dark:bg-gray-900" > <div class="absolute inset-0 dark:opacity-20 bg-[url(/img/dots.svg)] bg-[length:94%] bg-bottom bg-no-repeat" ></div> <div class="relative"> <div class="inline-flex h-16 w-16 items-center justify-center rounded-full border-2 border-gray-800 bg-gray-800 shadow-lg sm:h-20 sm:w-20" > <img src="/icons/authorization.svg" class="h-8 w-8 drop-shadow sm:h-10 sm:w-10" /> </div> <h3 class="mt-6 text-3xl font-bold text-gray-900 dark:text-white sm:mt-6 sm:text-4xl xl:text-[40px]" > Authorization </h3> <p class="mt-4 max-w-xl text-gray-700 dark:text-gray-400 sm:mt-6 lg:text-lg"> Nova is beautifully integrated with Laravel’s existing authorization policies. Let your Nova resources automatically leverage your existing application policies to determine a user’s abilities. Fine-grained authorization support is even provided for relationships, tools, actions, lenses, and fields. </p> </div> <div class="relative flex w-full flex-1 items-end pt-12" > <div class="h-[240px] w-full rounded-t-xl border-l border-r border-t border-gray-400/30 bg-gray-50 dark:border-gray-600/20 flex overflow-hidden bg-white dark:bg-gray-800" > <img class="dark:hidden object-cover" src="/img/feature-authorization.png" /> <img class="hidden dark:block object-cover" src="/img/feature-authorization-dark.png" /> </div> </div> </div> <div class="relative flex flex-col items-center rounded-xl border border-gray-400/30 px-10 pt-10 text-center dark:border-gray-600/20 lg:col-span-2 lg:pt-20 bg-white dark:bg-gray-900" > <div class="absolute inset-0 dark:opacity-20" ></div> <div class="relative"> <div class="inline-flex h-16 w-16 items-center justify-center rounded-full border-2 border-gray-800 bg-gray-800 shadow-lg sm:h-20 sm:w-20" > <img src="/icons/custom-fields.svg" class="h-8 w-8 drop-shadow sm:h-10 sm:w-10" /> </div> <h3 class="mt-6 text-3xl font-bold text-gray-900 dark:text-white sm:mt-6 sm:text-4xl xl:text-[40px]" > Custom Fields </h3> <p class="mt-4 max-w-xl text-gray-700 dark:text-gray-400 sm:mt-6 lg:text-lg"> Need a field type that isn’t included with Nova? No problem - use the Nova CLI to generate a custom field and take total control over its implementation and design. </p> </div> <div class="relative flex w-full flex-1 items-end pt-12" > <div class="h-[240px] w-full rounded-t-xl border-l border-r border-t border-gray-400/30 bg-gray-50 dark:border-gray-600/20 flex overflow-hidden lg:mx-auto lg:h-[600px] lg:w-[85%] bg-gray-100 dark:bg-gray-800" > <img class="dark:hidden object-cover" src="/img/feature-custom-fields.png" /> <img class="hidden dark:block object-cover" src="/img/feature-custom-fields-dark.png" /> </div> </div> </div> <div class="relative flex flex-col items-center rounded-xl border border-gray-400/30 px-10 pt-10 text-center dark:border-gray-600/20 bg-white dark:bg-gray-900" > <div class="absolute inset-0 dark:opacity-20" ></div> <div class="relative"> <div class="inline-flex h-16 w-16 items-center justify-center rounded-full border-2 border-gray-800 bg-gray-800 shadow-lg sm:h-20 sm:w-20" > <img src="/icons/powerful-search.svg" class="h-8 w-8 drop-shadow sm:h-10 sm:w-10" /> </div> <h3 class="mt-6 text-3xl font-bold text-gray-900 dark:text-white sm:mt-6 sm:text-4xl xl:text-[40px]" > Powerful Search </h3> <p class="mt-4 max-w-xl text-gray-700 dark:text-gray-400 sm:mt-6 lg:text-lg"> Feel the power of the Laravel ecosystem by linking your Nova administration panel with Laravel Scout. Once you do, you’ll get blazing fast search results powered by Algolia and the cloud. </p> </div> <div class="relative flex w-full flex-1 items-end pt-12" > <div class="h-[240px] w-full rounded-t-xl border-l border-r border-t border-gray-400/30 bg-gray-50 dark:border-gray-600/20 flex overflow-hidden bg-gray-100 dark:bg-gray-800" > <img class="dark:hidden object-cover" src="/img/feature-search.png" /> <img class="hidden dark:block object-cover" src="/img/feature-search-dark.png" /> </div> </div> </div> <div class="relative flex flex-col items-center rounded-xl border border-gray-400/30 px-10 pt-10 text-center dark:border-gray-600/20 bg-white dark:bg-gray-900" > <div class="absolute inset-0 dark:opacity-20" ></div> <div class="relative"> <div class="inline-flex h-16 w-16 items-center justify-center rounded-full border-2 border-gray-800 bg-gray-800 shadow-lg sm:h-20 sm:w-20" > <img src="/icons/notifications.svg" class="h-8 w-8 drop-shadow sm:h-10 sm:w-10" /> </div> <h3 class="mt-6 text-3xl font-bold text-gray-900 dark:text-white sm:mt-6 sm:text-4xl xl:text-[40px]" > Notifications </h3> <p class="mt-4 max-w-xl text-gray-700 dark:text-gray-400 sm:mt-6 lg:text-lg"> Notify your admins about important events like new sales, cancellations, and more by sending notifications directly to your Nova admin. </p> </div> <div class="relative flex w-full flex-1 items-end pt-12" > <div class="h-[240px] w-full rounded-t-xl border-l border-r border-t border-gray-400/30 bg-gray-50 dark:border-gray-600/20 flex overflow-hidden bg-gray-100 dark:bg-gray-800" > <img class="dark:hidden object-cover" src="/img/feature-notifications.png" /> <img class="hidden dark:block object-cover" src="/img/feature-notifications-dark.png" /> </div> </div> </div> <div class="relative flex flex-col items-center rounded-xl border border-gray-400/30 px-10 pt-10 text-center dark:border-gray-600/20 bg-white dark:bg-gray-900" > <div class="absolute inset-0 dark:opacity-20" ></div> <div class="relative"> <div class="inline-flex h-16 w-16 items-center justify-center rounded-full border-2 border-gray-800 bg-gray-800 shadow-lg sm:h-20 sm:w-20" > <img src="/icons/inline-relationships.svg" class="h-8 w-8 drop-shadow sm:h-10 sm:w-10" /> </div> <h3 class="mt-6 text-3xl font-bold text-gray-900 dark:text-white sm:mt-6 sm:text-4xl xl:text-[40px]" > Inline Relationships </h3> <p class="mt-4 max-w-xl text-gray-700 dark:text-gray-400 sm:mt-6 lg:text-lg"> Manage relations in the same form you create and edit resources. Nova’s powerful relationship support allows you to define painless editing workflows. </p> </div> <div class="relative flex w-full flex-1 items-end pt-12" > <div class="h-[240px] w-full rounded-t-xl border-l border-r border-t border-gray-400/30 bg-gray-50 dark:border-gray-600/20 flex overflow-hidden bg-gray-100 dark:bg-gray-800" > <img class="dark:hidden object-cover" src="/img/feature-inline-relationships.png" /> <img class="hidden dark:block object-cover" src="/img/feature-inline-relationships-dark.png" /> </div> </div> </div> <div class="relative flex flex-col items-center rounded-xl border border-gray-400/30 px-10 pt-10 text-center dark:border-gray-600/20 bg-white dark:bg-gray-900" > <div class="absolute inset-0 dark:opacity-20" ></div> <div class="relative"> <div class="inline-flex h-16 w-16 items-center justify-center rounded-full border-2 border-gray-800 bg-gray-800 shadow-lg sm:h-20 sm:w-20" > <img src="/icons/conditional-fields.svg" class="h-8 w-8 drop-shadow sm:h-10 sm:w-10" /> </div> <h3 class="mt-6 text-3xl font-bold text-gray-900 dark:text-white sm:mt-6 sm:text-4xl xl:text-[40px]" > Conditional Fields </h3> <p class="mt-4 max-w-xl text-gray-700 dark:text-gray-400 sm:mt-6 lg:text-lg"> Nova’s robust field dependency support allows you to show fields based on the values of other fields with a few lines of code - no custom fields required. </p> </div> <div class="relative flex w-full flex-1 items-end pt-12" > <div class="h-[240px] w-full rounded-t-xl border-l border-r border-t border-gray-400/30 bg-gray-50 dark:border-gray-600/20 flex overflow-hidden bg-gray-100 dark:bg-gray-800" > <img class="dark:hidden object-cover" src="/img/feature-conditional-fields.png" /> <img class="hidden dark:block object-cover" src="/img/feature-conditional-fields-dark.png" /> </div> </div> </div> </div> <div class="mt-12 rounded-xl border border-gray-400/30 bg-gray-100 p-12 text-center dark:border-gray-600/20 dark:bg-gray-900 sm:mt-12 sm:p-20 lg:mt-16 xl:p-24" > <h3 class="text-4xl font-semibold text-gray-900 dark:text-white lg:text-5xl"> It's a big universe... </h3> <p class="mx-auto mt-6 max-w-xl text-gray-600 dark:text-gray-400 sm:text-lg"> Nova has much more to offer. To get the full scoop, head over to the documentation to learn about all the cosmic possibilities. </p> <a href="/docs" class="mx-auto mt-12 inline-flex items-center justify-center rounded-lg border border-transparent bg-gradient-to-br from-green-300 to-blue-green-300 px-8 py-3.5 text-center font-semibold text-gray-900 transition hover:opacity-80 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50" > Read documentation </a> </div> </div> </section> <section class="mx-auto w-full max-w-2xl px-8 py-24 lg:max-w-7xl lg:py-32"> <h2 class="text-center text-4xl font-bold text-gray-900 dark:text-white md:text-5xl/tight lg:text-6xl/tight" > Don't take our word for it... </h2> <div class="mt-12 grid gap-x-8 gap-y-12 md:grid-cols-2 lg:grid-cols-3"> <blockquote class="flex flex-col"> <div class="flex flex-1 items-center rounded-xl border border-gray-400/30 bg-gray-100 p-8 dark:border-gray-600/20 dark:bg-gray-900" > <p class="text-lg leading-tight text-gray-900 dark:text-white"> “I use Nova on almost every Laravel app I build. We've used it to power the Lemon Squeezy back office since the beginning. It's by far the easiest and most powerful way to build an admin backend for your app.” </p> </div> <div class="mt-2.5 flex gap-4"> <div> <span class="inline-block h-5 w-5 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> <span class="inline-block h-2.5 w-2.5 translate-y-1 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> </div> <div class="flex items-center gap-4 pt-3"> <span class="inline-flex h-[52px] w-[52px] items-center justify-center overflow-hidden rounded-full bg-white dark:bg-gray-900" > <img src="https://pbs.twimg.com/profile_images/1830926417896292353/r_EnlPeQ_400x400.jpg" class="h-full w-full object-cover" /> </span> <cite class="not-italic"> <div class="font-semibold text-gray-900 dark:text-white"> Gilbert Pellegrom </div> <span class="text-sm text-gray-900 dark:text-white"> Co-founder / CTO of Lemon Squeezy </span> </cite> </div> </div> </blockquote> <blockquote class="flex flex-col"> <div class="flex flex-1 items-center rounded-xl border border-gray-400/30 bg-gray-100 p-8 dark:border-gray-600/20 dark:bg-gray-900" > <p class="text-lg leading-tight text-gray-900 dark:text-white"> “I’ve used Nova for years and it’s handled everything I’ve thrown at it. The amount of time it’s saved me has more than paid for itself.” </p> </div> <div class="mt-2.5 flex gap-4"> <div> <span class="inline-block h-5 w-5 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> <span class="inline-block h-2.5 w-2.5 translate-y-1 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> </div> <div class="flex items-center gap-4 pt-3"> <span class="inline-flex h-[52px] w-[52px] items-center justify-center overflow-hidden rounded-full bg-white dark:bg-gray-900" > <img src="https://pbs.twimg.com/profile_images/1563161709296353280/WPs91XKC_400x400.jpg" class="h-full w-full object-cover" /> </span> <cite class="not-italic"> <div class="font-semibold text-gray-900 dark:text-white"> Alex Garrett-Smith </div> <span class="text-sm text-gray-900 dark:text-white"> Founder of Codecourse </span> </cite> </div> </div> </blockquote> <blockquote class="flex flex-col"> <div class="flex flex-1 items-center rounded-xl border border-gray-400/30 bg-gray-100 p-8 dark:border-gray-600/20 dark:bg-gray-900" > <p class="text-lg leading-tight text-gray-900 dark:text-white"> “I bought Nova on the first day in was launched and never stopped learning more about it, to the point of releasing the first ever Nova course that dives into its secrets and powerful features that it offers for any Laravel app.” </p> </div> <div class="mt-2.5 flex gap-4"> <div> <span class="inline-block h-5 w-5 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> <span class="inline-block h-2.5 w-2.5 translate-y-1 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> </div> <div class="flex items-center gap-4 pt-3"> <span class="inline-flex h-[52px] w-[52px] items-center justify-center overflow-hidden rounded-full bg-white dark:bg-gray-900" > <img src="https://pbs.twimg.com/profile_images/1017161750842667008/3HyiqnwY_400x400.jpg" class="h-full w-full object-cover" /> </span> <cite class="not-italic"> <div class="font-semibold text-gray-900 dark:text-white"> Bruno Falcão </div> <span class="text-sm text-gray-900 dark:text-white"> Creator of Master Nova course </span> </cite> </div> </div> </blockquote> <blockquote class="flex flex-col"> <div class="flex flex-1 items-center rounded-xl border border-gray-400/30 bg-gray-100 p-8 dark:border-gray-600/20 dark:bg-gray-900" > <p class="text-lg leading-tight text-gray-900 dark:text-white"> “Nova is core to customer support at Chipper CI, letting us get customer information quickly to help resolve issues.” </p> </div> <div class="mt-2.5 flex gap-4"> <div> <span class="inline-block h-5 w-5 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> <span class="inline-block h-2.5 w-2.5 translate-y-1 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> </div> <div class="flex items-center gap-4 pt-3"> <span class="inline-flex h-[52px] w-[52px] items-center justify-center overflow-hidden rounded-full bg-white dark:bg-gray-900" > <img src="https://pbs.twimg.com/profile_images/2256212126/fideloper_400x400.jpg" class="h-full w-full object-cover" /> </span> <cite class="not-italic"> <div class="font-semibold text-gray-900 dark:text-white"> Chris Fidao </div> <span class="text-sm text-gray-900 dark:text-white"> Founder of Chipper CI </span> </cite> </div> </div> </blockquote> <blockquote class="flex flex-col"> <div class="flex flex-1 items-center rounded-xl border border-gray-400/30 bg-gray-100 p-8 dark:border-gray-600/20 dark:bg-gray-900" > <p class="text-lg leading-tight text-gray-900 dark:text-white"> “We've built Ranium's website CMS entirely on Nova, allowing us to swiftly create a custom job board and blog that perfectly fits our requirements, all seamlessly integrated within our CMS. Nova has been a game-changer!” </p> </div> <div class="mt-2.5 flex gap-4"> <div> <span class="inline-block h-5 w-5 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> <span class="inline-block h-2.5 w-2.5 translate-y-1 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> </div> <div class="flex items-center gap-4 pt-3"> <span class="inline-flex h-[52px] w-[52px] items-center justify-center overflow-hidden rounded-full bg-white dark:bg-gray-900" > <img src="https://pbs.twimg.com/profile_images/1654026714727727104/Z49US3M5_400x400.jpg" class="h-full w-full object-cover" /> </span> <cite class="not-italic"> <div class="font-semibold text-gray-900 dark:text-white"> Abbas Ali </div> <span class="text-sm text-gray-900 dark:text-white"> Developer at Ranium </span> </cite> </div> </div> </blockquote> <blockquote class="flex flex-col"> <div class="flex flex-1 items-center rounded-xl border border-gray-400/30 bg-gray-100 p-8 dark:border-gray-600/20 dark:bg-gray-900" > <p class="text-lg leading-tight text-gray-900 dark:text-white"> “Using Laravel Nova at http://Verse.ai has been a game changer. It’s crazy simple for our devs and has made our back office extremely happy with a serious ROI.” </p> </div> <div class="mt-2.5 flex gap-4"> <div> <span class="inline-block h-5 w-5 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> <span class="inline-block h-2.5 w-2.5 translate-y-1 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> </div> <div class="flex items-center gap-4 pt-3"> <span class="inline-flex h-[52px] w-[52px] items-center justify-center overflow-hidden rounded-full bg-white dark:bg-gray-900" > <img src="https://pbs.twimg.com/profile_images/1584650368612532226/X7uQ-WtH_400x400.jpg" class="h-full w-full object-cover" /> </span> <cite class="not-italic"> <div class="font-semibold text-gray-900 dark:text-white"> Joel Abitan </div> <span class="text-sm text-gray-900 dark:text-white"> VP of Engineering at Verse.ai </span> </cite> </div> </div> </blockquote> <blockquote class="flex flex-col"> <div class="flex flex-1 items-center rounded-xl border border-gray-400/30 bg-gray-100 p-8 dark:border-gray-600/20 dark:bg-gray-900" > <p class="text-lg leading-tight text-gray-900 dark:text-white"> “Nova shines by its incredible ease of use. I not only recommended it to countless clients, but I also made sure to have my personal license always up to date.” </p> </div> <div class="mt-2.5 flex gap-4"> <div> <span class="inline-block h-5 w-5 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> <span class="inline-block h-2.5 w-2.5 translate-y-1 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> </div> <div class="flex items-center gap-4 pt-3"> <span class="inline-flex h-[52px] w-[52px] items-center justify-center overflow-hidden rounded-full bg-white dark:bg-gray-900" > <img src="https://pbs.twimg.com/profile_images/1591153397532708864/jTj7B2tl_400x400.jpg" class="h-full w-full object-cover" /> </span> <cite class="not-italic"> <div class="font-semibold text-gray-900 dark:text-white"> Benjamin Crozat </div> <span class="text-sm text-gray-900 dark:text-white"> Indie Hacker and Blogger </span> </cite> </div> </div> </blockquote> <blockquote class="flex flex-col"> <div class="flex flex-1 items-center rounded-xl border border-gray-400/30 bg-gray-100 p-8 dark:border-gray-600/20 dark:bg-gray-900" > <p class="text-lg leading-tight text-gray-900 dark:text-white"> “We replaced our custom-built admin panel with Nova and couldn't be happier. It's simple but flexible. An incredible time saver.” </p> </div> <div class="mt-2.5 flex gap-4"> <div> <span class="inline-block h-5 w-5 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> <span class="inline-block h-2.5 w-2.5 translate-y-1 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> </div> <div class="flex items-center gap-4 pt-3"> <span class="inline-flex h-[52px] w-[52px] items-center justify-center overflow-hidden rounded-full bg-white dark:bg-gray-900" > <img src="https://pbs.twimg.com/profile_images/1752468260929339392/YyK2nRaA_400x400.jpg" class="h-full w-full object-cover" /> </span> <cite class="not-italic"> <div class="font-semibold text-gray-900 dark:text-white"> Trevor Gehman </div> <span class="text-sm text-gray-900 dark:text-white"> CTO of Clearstream </span> </cite> </div> </div> </blockquote> <blockquote class="flex flex-col"> <div class="flex flex-1 items-center rounded-xl border border-gray-400/30 bg-gray-100 p-8 dark:border-gray-600/20 dark:bg-gray-900" > <p class="text-lg leading-tight text-gray-900 dark:text-white"> “Laravel Nova helps us ship new features faster and empower our customer support team by reducing the boilerplate in maintaining our own admin tools.” </p> </div> <div class="mt-2.5 flex gap-4"> <div> <span class="inline-block h-5 w-5 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> <span class="inline-block h-2.5 w-2.5 translate-y-1 rounded-full border border-gray-200 bg-gray-100 dark:border-gray-600/20 dark:bg-gray-900" ></span> </div> <div class="flex items-center gap-4 pt-3"> <span class="inline-flex h-[52px] w-[52px] items-center justify-center overflow-hidden rounded-full bg-white dark:bg-gray-900" > <img src="https://pbs.twimg.com/profile_images/938950665346228224/1bdBHBWo_400x400.jpg" class="h-full w-full object-cover" /> </span> <cite class="not-italic"> <div class="font-semibold text-gray-900 dark:text-white"> Dwight Conrad Watson </div> <span class="text-sm text-gray-900 dark:text-white"> COO of Roomies.com </span> </cite> </div> </div> </blockquote> </div> </section> <section class="mx-auto max-w-2xl px-8 lg:max-w-7xl"> <a name="demo" /> <div class="relative rounded-xl border border-transparent bg-gradient-to-br from-green-300 to-blue-green-300 p-12 text-center sm:mt-12 sm:p-20 lg:mt-16 xl:p-24" > <div class="absolute inset-0 hidden bg-[url(/img/comets.svg)] bg-[length:480px] bg-left bg-no-repeat sm:block" ></div> <div class="relative"> <h3 class="text-4xl font-semibold text-gray-900 lg:text-5xl" > Take Nova for a spin </h3> <p class="mx-auto mt-6 max-w-xl text-gray-600 sm:text-lg"> Seeing is believing. Head on over to our Nova demo and see and example of Nova in action. You'll be able to experiment with resource management, metrics, and more. </p> <p class="text-xs mt-3 text-gray-600">(email: <span class="__cf_email__" data-cfemail="751110181a35191407140310195b161a18">[email protected]</span>, password: password)</p> <a href="https://nova-demo.laravel.com" class="mx-auto mt-12 inline-flex items-center justify-center rounded-lg border border-transparent bg-gray-900 px-8 py-3.5 text-center font-semibold text-white transition hover:opacity-80 focus:outline-none focus-visible:ring-2 focus-visible:ring-white" > Try the demo </a> </div> </div> </section> <section id="pricing" class="mx-auto max-w-7xl px-8 pb-16 pt-32"> <div class="text-center"> <h2 class="text-4xl font-bold text-gray-900 dark:text-white md:text-5xl/tight lg:text-6xl/tight" > Choose your package </h2> <p class="mx-auto mt-6 max-w-2xl text-gray-600 dark:text-gray-400 sm:text-lg" > Nova is a one-time purchase and includes free updates for a whole year. <br/> Purchase update renewals to receive another year of updates. </p> </div> <div class="mx-auto mt-16 grid max-w-md lg:max-w-none lg:grid-cols-2"> <div class="rounded-t-xl border-l border-r border-t border-gray-400/30 bg-gray-100 p-12 dark:border-gray-600/30 dark:bg-gray-900 lg:rounded-none lg:rounded-l-lg lg:border-b lg:border-r-0" > <h3 class="text-2xl font-semibold text-gray-900 dark:text-white"> Single license </h3> <p class="mt-6 flex items-center gap-2"> <span class="text-5xl font-bold text-gray-900 dark:text-white"> $99 </span> <span class="inline-flex flex-col text-xs text-gray-600 dark:text-gray-400" > <span class="ml-2">one-time payment</span> <span class="ml-2">renews at $79 per year</span> </span> </p> <ul class="mt-12 space-y-5"> <li class="flex items-center gap-3"> <img src="/icons/check-dark.svg" class="h-8 w-8 drop-shadow-md" /> <span class="text-gray-900 dark:text-white"> Single Project </span> </li> <li class="flex items-center gap-3"> <img src="/icons/check-dark.svg" class="h-8 w-8 drop-shadow-md" /> <span class="text-gray-900 dark:text-white"> Budget Conscious </span> </li> <li class="flex items-center gap-3"> <img src="/icons/check-dark.svg" class="h-8 w-8 drop-shadow-md" /> <span class="text-gray-900 dark:text-white"> All Nova Features </span> </li> </ul> <a href="/licenses/purchase" class="mt-8 inline-flex w-full items-center justify-center rounded-lg border border-transparent bg-gradient-to-br from-green-300 to-blue-green-300 px-8 py-3.5 text-center font-semibold text-gray-900 transition hover:opacity-80 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50" > Get Started </a> </div> <div class="rounded-b-xl border-b border-l border-r border-gray-600/30 bg-gray-800 bg-[url(/img/comets-2.svg)] bg-right-top p-12 dark:border-gray-600/30 dark:bg-gray-800 lg:rounded-none lg:rounded-r-xl lg:border-l-0 lg:border-t" > <h3 class="max-w-fit bg-gradient-to-r from-green-300 to-purple-300 bg-clip-text text-2xl font-bold text-transparent" > Unlimited </h3> <p class="mt-6 flex items-center gap-2"> <span class="text-5xl font-bold text-white"> $299 </span> <span class="inline-flex flex-col text-xs text-gray-400"> <span class="ml-2">one-time payment</span> <span class="ml-2">renews at $249 per year</span> </span> </p> <ul class="mt-12 space-y-5"> <li class="flex items-center gap-3"> <img src="/icons/check-light.svg" class="h-8 w-8 drop-shadow-md" /> <span class="text-white">Unlimited Projects</span> </li> <li class="flex items-center gap-3"> <img src="/icons/check-light.svg" class="h-8 w-8 drop-shadow-md" /> <span class="text-white">Email Support</span> </li> <li class="flex items-center gap-3"> <img src="/icons/check-light.svg" class="h-8 w-8 drop-shadow-md" /> <span class="text-white">All Nova Features</span> </li> </ul> <a href="/licenses/purchase" class="mt-8 inline-flex w-full items-center justify-center rounded-lg border border-transparent bg-gradient-to-br from-green-300 to-blue-green-300 px-8 py-3.5 text-center font-semibold text-gray-900 transition hover:opacity-80 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50" > Get Started </a> </div> </div> </section> <section class="mx-auto flex w-full max-w-2xl flex-col gap-6 px-8 pb-16 lg:max-w-7xl lg:flex-row" > <div class="flex shrink-0 items-center"> <h2 class="text-3xl font-semibold text-gray-900 dark:text-white lg:text-4xl" > Learn more about Nova </h2> </div> <div class="flex flex-1 flex-col items-start rounded-xl border border-gray-400/30 bg-gray-100 p-8 dark:border-gray-600/30 dark:bg-gray-900" > <p class="flex-1 text-gray-900 dark:text-white"> Nova has incredibly thorough documentation full of example code and screenshots. Dig in to learn more. </p> <a href="/docs" class="mt-8 inline-flex rounded-sm font-bold text-[#40C1E5] transition hover:opacity-80 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50" > Read the docs </a> </div> <div class="flex flex-1 flex-col items-start rounded-xl border border-gray-400/30 bg-gray-100 p-8 dark:border-gray-600/30 dark:bg-gray-900" > <p class="flex-1 text-gray-900 dark:text-white"> If you're a visual learner, head on over to Laracasts and watch the brand new 2023 edition of "Laravel Nova Mastery". </p> <a href="https://laracasts.com/series/laravel-nova-mastery-2023-edition" target="_blank" class="mt-8 inline-flex rounded-sm font-bold text-[#40C1E5] transition hover:opacity-80 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50" > Watch the series </a> </div> </section> </main> <footer class="mx-auto flex max-w-7xl flex-col items-center justify-center px-8 py-16 dark:border-gray-900" > <a href="/" class="tranistion rounded-sm hover:opacity-80 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50" > <span class="sr-only">Laravel Nova</span> <svg class="h-8 md:h-10" viewBox="0 0 204 37" xmlns="http://www.w3.org/2000/svg" > <defs> <radialGradient cx="-4.619%" cy="6.646%" fx="-4.619%" fy="6.646%" r="101.342%" gradientTransform="matrix(.8299 .53351 -.5579 .79363 .03 .038)" id="a" > <stop stop-color="#00FFC4" offset="0%"/> <stop stop-color="#00E1FF" offset="100%"/> </radialGradient> </defs> <g fill-rule="nonzero" fill="none"> <path d="M30.343 9.99a14.757 14.757 0 0 1 .046 20.972 18.383 18.383 0 0 1-13.019 5.365A18.382 18.382 0 0 1 3.272 29.79c7.209 5.955 17.945 5.581 24.713-1.118a11.477 11.477 0 0 0 0-16.345c-4.56-4.514-11.953-4.514-16.513 0a4.918 4.918 0 0 0 0 7.006 5.04 5.04 0 0 0 7.077 0 1.68 1.68 0 0 1 2.359 0 1.639 1.639 0 0 1 0 2.333 8.4 8.4 0 0 1-11.794 0 8.198 8.198 0 0 1 0-11.674c5.861-5.805 15.366-5.805 21.229 0ZM17.37 0a18.38 18.38 0 0 1 14.097 6.538C24.257.583 13.52.958 6.756 7.653v.002a11.477 11.477 0 0 0 0 16.346c4.558 4.515 11.95 4.515 16.51 0a4.918 4.918 0 0 0 0-7.005 5.04 5.04 0 0 0-7.077 0 1.68 1.68 0 0 1-2.358 0 1.639 1.639 0 0 1 0-2.334 8.4 8.4 0 0 1 11.794 0 8.198 8.198 0 0 1 0 11.674c-5.862 5.805-15.367 5.805-21.23 0a14.756 14.756 0 0 1-.02-20.994A18.383 18.383 0 0 1 17.37 0Z" fill="url(#a)" /> <path d="M59.211 27.49a1.68 1.68 0 0 0 1.69-1.69 1.68 1.68 0 0 0-1.69-1.69h-6.88V12.306c0-1.039-.82-1.86-1.86-1.86-1.037 0-1.858.821-1.858 1.86v13.325c0 1.039.82 1.858 1.859 1.858h8.74Zm9.318-13.084c2.004 0 3.453.531 4.37 1.448.965.967 1.4 2.39 1.4 4.13v5.888c0 .99-.798 1.763-1.787 1.763-1.062 0-1.763-.749-1.763-1.52v-.026c-.893.99-2.123 1.642-3.91 1.642-2.438 0-4.441-1.4-4.441-3.959v-.048c0-2.824 2.148-4.128 5.214-4.128a9.195 9.195 0 0 1 3.163.532v-.218c0-1.521-.944-2.366-2.777-2.366a8.416 8.416 0 0 0-2.535.361 1.525 1.525 0 0 1-.53.098c-.846 0-1.521-.652-1.521-1.496 0-.635.394-1.203.989-1.425 1.16-.435 2.414-.676 4.128-.676Zm-.05 7.387c-1.567 0-2.533.628-2.533 1.786v.047c0 .99.821 1.57 2.005 1.57h-.001l.195-.004c1.541-.066 2.59-.915 2.672-2.113l.005-.151v-.653c-.628-.289-1.448-.482-2.342-.482Zm10.817 5.842c1.014 0 1.833-.82 1.833-1.835v-3.428c0-2.607 1.04-4.03 2.898-4.465.748-.17 1.375-.75 1.375-1.714 0-1.04-.652-1.787-1.785-1.787-1.088 0-1.956 1.159-2.486 2.415v-.58a1.835 1.835 0 1 0-3.67 0v9.56c0 1.013.82 1.833 1.833 1.833l.002.001Zm13.01-13.229c2.005 0 3.453.531 4.37 1.448.965.967 1.4 2.39 1.4 4.13v5.888c0 .99-.797 1.763-1.786 1.763-1.063 0-1.763-.749-1.763-1.52v-.026c-.893.99-2.123 1.643-3.911 1.643-2.438-.001-4.44-1.401-4.44-3.96v-.048c0-2.824 2.148-4.128 5.214-4.128a9.195 9.195 0 0 1 3.162.532v-.218c0-1.521-.943-2.366-2.776-2.366a8.416 8.416 0 0 0-2.535.361 1.525 1.525 0 0 1-.53.098c-.847 0-1.522-.652-1.522-1.496 0-.635.395-1.203.99-1.425 1.16-.435 2.413-.676 4.127-.676Zm-.048 7.387c-1.568 0-2.534.628-2.534 1.786v.047c0 .99.821 1.57 2.003 1.57 1.714 0 2.872-.94 2.872-2.268v-.653c-.627-.289-1.447-.482-2.341-.482Zm14.17 5.963c.99 0 1.667-.653 2.076-1.593l3.959-9.15c.072-.169.194-.555.194-.869a1.736 1.736 0 0 0-1.764-1.738c-.965 0-1.472.628-1.712 1.255l-2.825 7.556-2.775-7.508c-.267-.748-.798-1.303-1.788-1.303-.989 0-1.786.845-1.786 1.714 0 .338.097.652.194.894l3.959 9.149c.41.965 1.086 1.593 2.075 1.593h.194-.001Zm13.977-13.447c4.321 0 6.228 3.55 6.228 6.228 0 1.063-.748 1.763-1.714 1.763h-7.265c.362 1.665 1.52 2.535 3.162 2.535a4.237 4.237 0 0 0 2.607-.87 1.37 1.37 0 0 1 .894-.29c.82 0 1.423.63 1.423 1.449 0 .483-.216.846-.483 1.086-1.134.967-2.607 1.57-4.49 1.57-3.886 0-6.758-2.728-6.758-6.687v-.047c0-3.695 2.63-6.737 6.396-6.737Zm0 2.945c-1.52 0-2.51 1.086-2.8 2.753h5.528c-.217-1.642-1.183-2.753-2.728-2.753Zm11.033 10.381c1.014 0 1.833-.82 1.833-1.835V11.556a1.834 1.834 0 0 0-3.668 0V25.8c0 1.014.82 1.833 1.833 1.833l.002.003Zm14.75 0c1.013 0 1.833-.82 1.833-1.835v-9.053l7.435 9.753c.507.653 1.039 1.086 1.93 1.086h.123c1.037 0 1.858-.82 1.858-1.858V12.283a1.835 1.835 0 0 0-3.67 0v8.713l-7.17-9.415c-.505-.651-1.037-1.086-1.93-1.086h-.386c-1.038 0-1.859.821-1.859 1.859v13.445c0 1.014.82 1.836 1.834 1.836h.001Zm23.244-13.326c4.007 0 6.976 2.97 6.976 6.687v.048c0 3.719-2.993 6.735-7.024 6.735-4.007 0-6.976-2.97-6.976-6.686v-.047c0-3.719 2.993-6.737 7.024-6.737Zm-.048 3.163c-2.1 0-3.355 1.617-3.355 3.524v.048c0 1.907 1.375 3.573 3.403 3.573 2.1 0 3.355-1.617 3.355-3.524v-.049c0-1.905-1.375-3.572-3.403-3.572Zm14.798 10.284c.99 0 1.664-.653 2.076-1.593l3.958-9.15c.072-.169.195-.555.195-.869a1.736 1.736 0 0 0-1.764-1.738c-.966 0-1.473.628-1.713 1.255l-2.825 7.556-2.777-7.508c-.264-.748-.796-1.303-1.786-1.303-.989 0-1.786.845-1.786 1.714 0 .338.097.652.194.894l3.959 9.149c.41.965 1.086 1.593 2.075 1.593h.194Zm13.76-13.35c2.003 0 3.451.531 4.368 1.448.967.967 1.4 2.39 1.4 4.13v5.888c0 .99-.796 1.763-1.786 1.763-1.061 0-1.761-.749-1.761-1.52v-.026c-.894.99-2.126 1.642-3.91 1.642-2.44 0-4.444-1.4-4.444-3.959v-.048c0-2.824 2.149-4.128 5.215-4.128a9.195 9.195 0 0 1 3.162.532v-.218c0-1.521-.942-2.366-2.776-2.366a8.416 8.416 0 0 0-2.535.361 1.52 1.52 0 0 1-.53.098c-.845 0-1.522-.652-1.522-1.496 0-.636.395-1.204.99-1.425 1.159-.435 2.415-.676 4.129-.676Zm-.049 7.387c-1.57 0-2.535.628-2.535 1.786v.047c0 .99.821 1.57 2.004 1.57 1.714 0 2.873-.94 2.873-2.268v-.653c-.628-.289-1.449-.482-2.342-.482Z" class="fill-current text-gray-600 dark:text-white" /> </g> </svg> </a> <a href="/cdn-cgi/l/email-protection#d8b6b7aeb998b4b9aab9aebdb4f6bbb7b5" class="mt-12 rounded-sm text-gray-600 transition-colors hover:text-gray-400 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50 dark:text-gray-400 dark:hover:text-white"> Customer Support </a> <a href="/faq" class="mt-5 rounded-sm text-gray-600 transition-colors hover:text-gray-400 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50 dark:text-gray-400 dark:hover:text-white" > Frequently Asked Questions </a> <a href="/terms" class="mt-5 rounded-sm text-gray-600 transition-colors hover:text-gray-400 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50 dark:text-gray-400 dark:hover:text-white" > Terms of Service </a> <a href="/login" class="mt-5 rounded-sm text-gray-600 transition-colors hover:text-gray-400 focus:outline-none focus-visible:ring-2 focus-visible:ring-green-300/50 dark:text-gray-400 dark:hover:text-white" > My Nova Account </a> <p class="mt-20 text-center text-sm text-gray-600 dark:text-gray-400"> © 2025 Laravel Holdings Inc. </p> </footer> </div> </div> <script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script></body> </html>

CINXE.COM

Laravel Nova - Beautifully-designed administration panel for Laravel