Skip to content

Create, manage, and customize notes directly on any webpage. Stay organized with categories, prioritization, and local storage.

Notifications You must be signed in to change notification settings

PolyXGO/FlexiNote-extension

Repository files navigation

FlexiNote - Smart Sticky Notes

🚀 Transform Any Website into Your Personal Notebook

FlexiNote lets you place sticky notes on any webpage.
Keep your thoughts right where you found them.

Available in the Chrome Web Store
Download FlexiNote

✨ Free • Privacy-focused • No Signup Required

Overview

FlexiNote is a powerful Chrome extension that allows you to create, manage, and customize sticky notes directly on any webpage. It offers a seamless note-taking experience with a floating editor, a side panel for quick access, and a comprehensive dashboard for management.

Key Features

  • Place notes anywhere: Right-click on any website to add a note.
  • Customizable: Drag, resize, and color-code every note.
  • Organize: Use Categories and Importance Levels (Low to Critical).
  • Side Panel: Quick access to all notes and search functionality.
  • Dashboard: Centralized management for notes, settings, and categories.
  • Deep Linking: Jump straight to your notes on specific pages.
  • Auto Arrange: Tidy up your screen with the grid system.

Installation

Install FlexiNote directly from the Chrome Web Store:

Download FlexiNote

User Guide

1. Creating Notes

  • Right-Click Context Menu:
    • Right-click anywhere on a webpage and select Add note here to create a note at that exact spot.
    • Select Quick Add note page to instantly create a note containing the current page title and URL.

2. Interacting with Notes

  • Move: Click and drag the header or body to move the note.
  • Resize: Drag any edge or corner to resize the note.
  • Edit: Double-click the Title or Content area to switch to edit mode.
  • Toolbar Controls: Change color, pin, minimize, or delete via the note toolbar.
  • Organization: Assign categories and set importance levels directly from the note footer.

3. Side Panel & Dashboard

  • Side Panel: Click the floating button (📝) or use the extension icon to open the panel for quick search and navigation.
  • Dashboard: access via FlexiNote > Settings to view all notes in a grid, manage categories, and configure extension settings (default opacity, colors, etc.).

Tech Stack

  • HTML5, CSS3, JavaScript (Vanilla)
  • Chrome Storage API
  • Dictionary & Data persistence via chrome.storage.local

Support

If you find this source code helpful, consider buying me a coffee to support my work! ☕

Buy Me A Coffee

-or-

Cafe code trau nhe Ngok Ngok

About

Create, manage, and customize notes directly on any webpage. Stay organized with categories, prioritization, and local storage.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published