@sweetalert2/themes - Official Themes for SweetAlert2
You can install all themes at once:
npm install --save sweetalert2 @sweetalert2/themes
Or just a single theme @sweetalert2/theme-<theme_name>
, e.g.
npm install --save sweetalert2 @sweetalert2/theme-dark
Or grab them both from jsdelivr CDN, for example:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@sweetalert2/theme-dark@5/dark.css" />
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.js"></script>
With CSS:
<!-- Include a required theme -->
<link rel="stylesheet" href="@sweetalert2/themes/dark/dark.css" />
<script src="sweetalert2/dist/sweetalert2.min.js"></script>
With SASS:
your-app.js
:
import Swal from 'sweetalert2/dist/sweetalert2.js';
your-app.scss
:
@import 'sweetalert2/themes/dark/dark.scss';
If you would like to contribute enhancements or fixes, please do the following:
-
Fork the
sweetalert2-themes
repository and clone it locally. -
When in the
sweetalert2-themes
directory, runnpm install
oryarn install
to install dependencies. -
To begin active development, run
npm start
oryarn start
. If you want to start with a specific theme preselected, use:npm run start -- --theme <theme-name>
oryarn start --theme <theme-name>
-
Or, if you want to quickly start a new theme, run
npm run create-new-theme my-awesome-theme
. This will automatically start the server after creating the theme's default files. If you interrupt the server and want to restart it, usenpm run start -- --theme <theme-name>
oryarn start --theme <theme-name>
Has SweetAlert2 helped you create an amazing application? You can show your support by making a donation:
- GitHub Sponsors โค๏ธ
- PayPal
- Bitcoin:
12BxefvPMtHePgfPRDL1SaZYSG4GwQmWoP
- Ether:
0x36e2b10666e2c0dc343901895ba3697b5d3214d1
- Bitcoin Cash:
qqxs402qszgwuue00gwxw996lzhpa8up2unqm0y46g
- Stellar:
GBRS5KGFJO4OBUGW3TRQBIVXTM5YDS53DOSHGA3LKVE2YXKVKNVDONBP