%% run start ```ts const {LinkPreview} = customJS return LinkPreview.getLinkPreviewFromUrl("https://github.com/2nthony/vercel-toast") ``` %% <div class="nifty-link-card-container"> <a class="nifty-link-card" href="https://github.com/2nthony/vercel-toast" target="_blank"> <div class="nifty-link-card-text"> <div class="nifty-link-card-title line-clamp-2">GitHub - 2nthony/vercel-toast: 💬 Framework-agnostic vercel design's toast component (≈1KB Gzipped)</div> <div class="nifty-link-card-description">💬 Framework-agnostic vercel design's toast component (≈1KB Gzipped) - GitHub - 2nthony/vercel-toast: 💬 Framework-agnostic vercel design's toast component (≈1KB Gzipped)</div> <div class="nifty-link-href"> <img class="nifty-link-icon" src="https://github.com/fluidicon.png"> https://github.com/2nthony/vercel-toast </div> </div> <div class="nifty-link-image-container"> <div class="nifty-link-image" style="background-image: url('https://opengraph.githubassets.com/f8fcb41645a79b81ef185d26818a694c63d5bc3169924b81bec8fa8d35bd1d2e/2nthony/vercel-toast')"> </div> </div> </a> </div> %% run end %% ## [Bundler](https://github.com/2nthony/vercel-toast#bundler) ```shell npm i vercel-toast ``` ```ts // in js file import 'vercel-toast/css' import { createToast } from 'vercel-toast' createToast('Hi from vercel toast!') ``` ## [Browser CDN](https://github.com/2nthony/vercel-toast#browser-cdn) ```html <link rel="stylesheet" href="https://unpkg.com/vercel-toast/dist/vercel-toast.css" /> <script src="https://unpkg.com/vercel-toast"></script> <script> vercelToast.createToast("Hi from vercel toast!"); </script> ``` > [!info] read more > not as beautiful as [[Sonner - a beautiful react toast library]] but is framework agnostic.