Great design gives your site personality. These tools help you go from default to delightful:

• Google Fonts: A library of free fonts.
• Web Safe Fonts: A list of fonts that work everywhere—no installation required.
• Heropatterns: Background patterns you can copy and paste into your CSS.
• Hero Icons: Beautiful, free SVG icons.
• SVG Repo: Free SVG assets to use however you like.
• UnDraw: Free illustrations for your projects.
• Adobe Color: Make stunning color palettes fast.
• Unsplash: Free stock photography with great quality.
• Pexels: Free stock video for background loops or creative content.
• Deep AI: Generate images from text (great for placeholders or concept art).

---

Sometimes, the best way to break a creative block is to see what others are building. Here's where to look:

• Loveable: Inspiring vibe-coded apps from the community.
• Behance: Design portfolios from around the world.
• Dribbble: Creative UI/UX snippets and visual playgrounds.
• CodePen: Frontend experiments and mini apps.
• Awwwards: Award-winning websites that push boundaries.
• Codrops: Tutorials and experimental UI components.

---

You don't need to build a backend to build something useful. These public APIs let you bring in live data without limits:

• OpenWeatherMap: Get real-time weather data.
• DiceBear: Generate avatars on the fly (great for games or profiles).
• Quotable: Quote generator API.
• JSONPlaceholder: Fake posts, comments, and users for testing.
• Unsplash API: Plug stock photography right into your project.

---

Here are tools that can improve your workflow or help you build faster:

• Cursor: AI-powered code editor with built-in context understanding.
• Bolt: Another AI coding assistant, optimized for creative coding.
• Eleventy (11ty): Lightweight static site generator—perfect for blogs and portfolios.
• Nuxt.js: Vue-based framework with powerful features for SPAs and static sites.
• GitHub: Share, store, and collaborate on code with version control.
• Figma: Collaborative design tool for wireframes, mockups, and more.

---

Want to experiment with an AI dev assistant? Try one of these prompt ideas:

Game Projects

Memory Game

Using Nuxt.js and the Dicebear API (Bottts style), create a matching game.
Cards flip on click, stay revealed if they match, and flip back if they don't.
Give it a retro arcade vibe using neon fonts and sounds.

Tic Tac Toe

Create a responsive Tic Tac Toe game using plain HTML, CSS, and JavaScript.
Track wins and display a reset button when the game ends.
Bonus: Add animations and a dark mode.

Site + Blog Projects

Blog with 11ty

Build a personal blog using 11ty. Include a homepage, post list, and tags.
Use Markdown for writing and Nunjucks for templating.
Deploy to Netlify with a custom domain.

Design Portfolio

Using HTML and CSS, create a single-page portfolio that showcases 3–5 design projects.
Add smooth scroll and animated transitions.
Use Figma or Adobe Color to plan your color palette.

API-Powered Projects

Random Photo Gallery

Create a photo gallery that pulls random images from the Unsplash API.
Use masonry layout with CSS grid.
Include a "Refresh" button to get new photos.

Quote of the Day

Build a widget that shows a random quote from the Quotable API every time the page loads.
Style it like a sticky note or retro terminal.

Big Project Prompt

Job Board App

Build a job board app where users can browse, search, and filter jobs.
Use JSONPlaceholder to simulate job listings.
Include saved jobs using localStorage.
Bonus: Add user login with Netlify Identity.

Supabase-Connected Projects

Community Guestbook (Vanilla JS + Supabase)

Build a digital guestbook where visitors can leave short messages.
Use Supabase for anonymous sign-in and storing messages.
Messages should show in real time (use Supabase's `on()` method to subscribe).
Bonus: Add moderation by filtering banned words.

Mood Tracker (Vue + Supabase)

Create a mood tracking app where logged-in users can log their daily mood.
Store entries in Supabase with a date, emoji, and optional note.
Display a chart of recent moods using a charting library like Chart.js.
Bonus: Add color-coded calendar view.

Digital Reading List (11ty + Supabase)

Build a reading list site where users can log books they've read.
Use 11ty to generate the static frontend.
Use a small client-side JS script to interact with Supabase for adding/removing books.
Optional: Filter by genre or author.

Build-a-Profile App (Nuxt + Supabase)

Create a user profile dashboard in Nuxt where users can log in, update their avatar, and manage bio/social links.
Use Supabase Auth for login (email or GitHub).
Store profile data in Supabase `users` table.
Bonus: Show public profiles for others to browse.

Live Polling App (HTML/CSS/JS + Supabase)

Create a simple poll with Supabase that shows live vote counts as users vote.
No login required—just create a poll, vote, and see results in real-time.
Use Supabase's Realtime API to subscribe to vote changes.
Bonus: Add bar graph animation.

---