Beautiful Bookmarks

Beautiful Bookmarks is a Chrome extension that transforms the default new tab page into a visually engaging bookmark manager. It combines search, folder filtering, drag-and-drop organization, website previews, and light/dark themes in a responsive Bento Grid interface.

Chrome's default bookmark experience provides limited visual organization and makes it difficult to quickly browse a large collection of saved websites. The goal was to create a more intuitive and visually engaging bookmark experience that allows users to search, filter, organize, and recognize their bookmarks at a glance.

• Custom Chrome New Tab Page
• Bookmark Search by Title and URL
• Folder-Based Bookmark Filtering
• Responsive Bento Grid Layout
• Drag-and-Drop Bookmark Reordering
• Website Preview Images using Open Graph Metadata
• Fallback Website Screenshots for Missing Previews
• Light and Dark Theme Support

• Built a Chrome Manifest V3 extension using React 19 and the Chrome Bookmarks API.
• Implemented reusable React components and custom hooks to manage bookmark data and UI state.
• Designed a dense 12-column Bento Grid layout that automatically fills available space while supporting different card sizes.
• Implemented drag-and-drop interactions to allow users to reorganize bookmarks directly within the grid.
• Built website preview generation using Open Graph metadata with a screenshot service fallback for sites without preview images.
• Used Chrome Storage API to persist bookmark-related data and extension preferences.

• Designed and developed the complete Chrome extension using React and JavaScript.
• Integrated Chrome's Bookmarks and Storage APIs to access and manage user bookmarks
• Designed the Bento Grid interface with responsive layouts and reusable UI components.
• Implemented search, folder filtering, drag-and-drop reordering, and theme switching.
• Developed the website preview system using Open Graph metadata and screenshot fallbacks.