Skip to content

Web Customizer Pro 🌐✨ – Chrome extension to customize any website your way! πŸŒ™ Dark Mode everywhere with adjustable intensity πŸ“ Custom fonts & better readability ⚑ Inject your own CSS with real-time preview πŸ”§ Site-specific settings & smooth performance

Notifications You must be signed in to change notification settings

Prachi9506/Web_Customizer_Pro

Repository files navigation

Web Customizer Pro Chrome Extension

A powerful Chrome extension that allows users to customize any website with dark mode, custom fonts, and CSS injection capabilities.

Features

πŸŒ™ Dark Mode Everywhere

  • Apply dark mode to any website, even if it doesn't natively support it
  • Adjustable intensity levels (1-10) for different darkness preferences
  • Smart filtering that preserves images and media content
  • Smooth transitions for a polished experience

πŸ“ Font Customization

  • Change font family across all websites or specific sites
  • Adjust font size (80%-150%) for better readability
  • Customize line height (100%-200%) for improved text spacing
  • Preserves monospace fonts for code blocks and icon fonts

⚑ Custom CSS Injection

  • Write and inject custom CSS for any website
  • Site-specific and global CSS rules
  • Real-time preview and application
  • Built-in CSS editor with syntax highlighting

🌐 Site-Specific Settings

  • Different settings for each website
  • Global fallback settings
  • Easy reset options for individual sites or all settings
  • Automatic settings persistence

Installation

Manual Installation (Developer Mode)

  1. Download or clone this repository
  2. Open Chrome and navigate to chrome://extensions/
  3. Enable "Developer mode" in the top right corner
  4. Click "Load unpacked" and select the extension directory
  5. The extension will appear in your extensions list

Usage

Basic Usage

  1. Click the Web Customizer Pro icon in your browser toolbar
  2. Use the toggles to enable different features:
    • Dark Mode: Toggle the moon icon to enable/disable dark mode
    • Font Customization: Toggle the text icon to enable font changes
    • Custom CSS: Toggle the lightning icon to enable CSS injection

Dark Mode

  • Enable the toggle to apply dark mode to the current website
  • Adjust the intensity slider (1-10) to control darkness level
  • Higher values create darker themes, lower values are more subtle

Font Customization

  • Choose from popular web fonts in the dropdown
  • Adjust font size using the slider
  • Modify line height for better text readability (100%-200%)

Custom CSS

  • Write CSS in the textarea provided
  • Click "Apply CSS" to inject your styles
  • Use "Clear" to remove all custom CSS
  • CSS is applied immediately and saved automatically

Site Management

  • Current Site: Shows the domain of the active tab
  • Reset This Site: Removes all customizations for the current website
  • Reset All Sites: Clears all saved settings across all websites

About

Web Customizer Pro 🌐✨ – Chrome extension to customize any website your way! πŸŒ™ Dark Mode everywhere with adjustable intensity πŸ“ Custom fonts & better readability ⚑ Inject your own CSS with real-time preview πŸ”§ Site-specific settings & smooth performance

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published