A powerful Chrome extension that seamlessly integrates with Anki to help you create flashcards while browsing the web.
-
Step-by-Step Card Creation: Simple 3-step process to create new cards
-
Deck Selection: Choose from your available Anki decks
-
Note Type Selection: Select the appropriate note type for your card
-
Dynamic Form Fields: Automatically generates form fields based on your note type
-
Smart Integration: Works with AnkiConnect for seamless Anki integration
-
Customizable Settings: Configure AnkiConnect endpoint and preferences
- Clone or download this repository
- Open Chrome and navigate to
chrome://extensions/ - Enable "Developer mode" in the top right
- Click "Load unpacked" and select the extension directory
- The extension should now appear in your extensions list
- Download the
.crxfile (when available) - Drag and drop the file into Chrome's extensions page
- Confirm the installation
-
Install AnkiConnect addon in Anki:
- Open Anki
- Go to Tools > Add-ons > Browse & Install
- Enter code:
2055492159 - Restart Anki
-
Configure the extension:
- Click the extension icon in Chrome
- Click "Options" to open settings
- Set your AnkiConnect endpoint (default:
http://localhost:8765)
The extension provides a simple 3-step process:
- Select Deck: Choose which Anki deck to add your card to
- Select Note Type: Choose the type of note (Basic, Cloze, etc.)
- Fill Fields: Enter the content for each field in your note type
- Extension Icon: Click the extension icon in your toolbar
- Click the AnkiChrome extension icon
- Select a deck from the dropdown
- Click "Continue to Note Type"
- Select a note type from the dropdown
- Click "Continue to Card Creation"
- Fill in the required fields
- Click "Create Card"
ankichrome/
├── manifest.json # Extension manifest
├── background.js # Background service worker with AnkiConnect API
├── content.js # Content script for web pages
├── popup.html # Extension popup interface
├── popup.css # Popup styles
├── popup.js # Popup functionality
├── options.html # Options page
├── options.css # Options page styles
├── options.js # Options page functionality
├── icons/ # Extension icons
│ ├── icon16.png # 16x16 icon
│ ├── icon32.png # 32x32 icon
│ ├── icon48.png # 48x48 icon
│ └── icon128.png # 128x128 icon
└── README.md # This file
- Chrome browser
- Basic knowledge of HTML, CSS, and JavaScript
- Anki with AnkiConnect addon
- Make your changes to the source files
- Test in Chrome's extension development mode
- Use Chrome's "Pack Extension" feature to create a
.crxfile
- Load the extension in development mode
- Test the step-by-step card creation flow
- Check console for any errors
- Verify Anki integration works correctly
- Enable Extension: Toggle the extension on/off
- AnkiConnect Endpoint: URL for AnkiConnect (usually http://localhost:8765)
The extension automatically:
- Tests connection to AnkiConnect
- Retrieves available decks
- Gets note types and field information
- Creates cards with proper field mapping
- Extension not working: Check if it's enabled in Chrome extensions
- Anki connection failed: Verify AnkiConnect is installed and Anki is running
- No decks shown: Ensure you have decks created in Anki
- No note types available: Check that your Anki has note types configured
- Open Chrome DevTools
- Go to Console tab
- Look for AnkiChrome-related messages
- Check for any error messages
- Fork the repository
- Create a feature branch
- Make your changes
- Test thoroughly
- Submit a pull request
This project is open source and available under the MIT License.
For issues and questions:
- Check the troubleshooting section
- Review the console for error messages
- Ensure AnkiConnect is properly configured
- Verify Chrome extension permissions
- Initial release
- Step-by-step card creation interface
- Deck and note type selection
- Dynamic form field generation
- AnkiConnect integration
- Options page for configuration
- Advanced card templates
- Batch import functionality
- Cloud sync support
- Mobile app companion
- Advanced search and filtering
- Integration with other flashcard apps