Next.js logo
The Next.js logo as clean SVG, in brand color and mono, with a dark-mode variant. Copy it, download it, or install it as a typed React component.
- Brand color
- #000000
- Categories
- Frameworks
- Variants
- 5 SVG files
- Website
- vercel.com
- Brand guidelines
- Read before use
- Source
- gilbarbara/logos · CC0
Use the Next.js logo
shadcn CLI
npx shadcn@latest add @logoforge/nextjsFirst time? Add the @logoforge registry to components.json, or use the MCP server.
React
import { NextjsLogo } from "@/components/logos/nextjs";
<NextjsLogo className="size-8" />
<NextjsLogo variant="mono" /> {/* currentColor */}
<NextjsLogo type="wordmark" className="h-6 w-auto" />icon.svg
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid" viewBox="0 0 256 256"><title>Next.js</title><defs><linearGradient id="nextjs-c" x1="55.633%" x2="83.228%" y1="56.385%" y2="96.08%"><stop offset="0%" stop-color="#fff"/><stop offset="100%" stop-color="#fff" stop-opacity="0"/></linearGradient><linearGradient id="nextjs-d" x1="50%" x2="49.953%" y1="0%" y2="73.438%"><stop offset="0%" stop-color="#fff"/><stop offset="100%" stop-color="#fff" stop-opacity="0"/></linearGradient><circle id="nextjs-a" cx="128" cy="128" r="128"/></defs><mask id="nextjs-b" fill="#fff"><use xlink:href="#nextjs-a"/></mask><g mask="url(#nextjs-b)"><circle cx="128" cy="128" r="128"/><path fill="url(#nextjs-c)" d="M212.634 224.028 98.335 76.8H76.8v102.357h17.228V98.68L199.11 234.446a128 128 0 0 0 13.524-10.418"/><path fill="url(#nextjs-d)" d="M163.556 76.8h17.067v102.4h-17.067z"/></g></svg>Download
Related logos
Next.js and the Next.js logo are trademarks of their respective owner. Logoforge is not affiliated with or endorsed by Next.js; the logo is provided to refer to the product. Follow the brand's own guidelines. Own this brand and want it removed? Contact us — handled within 72 hours.