diff --git a/README.md b/README.md
index 6224fdb..42bcdd9 100644
--- a/README.md
+++ b/README.md
@@ -1,3 +1,5 @@
 # wp-gray-dates
 
-在设定的特定日期（月-日）自动将网站变为灰色，每年的这些日期都会自动变灰。
\ No newline at end of file
+在设定的特定日期（月-日）自动将网站变为灰色，每年的这些日期都会自动变灰。
+
+插件卸载后会自动清除数据。
\ No newline at end of file
diff --git a/css/admin.css b/css/admin.css
new file mode 100644
index 0000000..5ef8379
--- /dev/null
+++ b/css/admin.css
@@ -0,0 +1,77 @@
+.gray-dates-container {
+    margin: 20px 0;
+    padding: 15px;
+    background: #fff;
+    border: 1px solid #ccd0d4;
+    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
+}
+
+.gray-date-item {
+    margin-bottom: 10px;
+    display: flex;
+    align-items: center;
+}
+
+.gray-date-item input {
+    margin-right: 10px;
+    width: 150px;
+}
+
+.add-date {
+    margin-top: 10px !important;
+}
+
+/* 日期选择器样式优化 */
+.ui-datepicker {
+    padding: 10px;
+    border: 1px solid #ddd;
+    background: #fff;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+}
+
+.ui-datepicker-header {
+    background: #f7f7f7;
+    border-bottom: 1px solid #eee;
+    padding: 5px;
+    margin-bottom: 5px;
+}
+
+.ui-datepicker-title {
+    text-align: center;
+    font-weight: bold;
+}
+
+.ui-datepicker-prev,
+.ui-datepicker-next {
+    cursor: pointer;
+    padding: 0 5px;
+}
+
+.ui-datepicker-prev {
+    float: left;
+}
+
+.ui-datepicker-next {
+    float: right;
+}
+
+.ui-datepicker-calendar th {
+    padding: 3px;
+    text-align: center;
+}
+
+.ui-datepicker-calendar td {
+    padding: 3px;
+    text-align: center;
+}
+
+.ui-datepicker-calendar a {
+    display: block;
+    padding: 3px;
+    text-decoration: none;
+    text-align: center;
+}
+
+.ui-datepicker-calendar a:hover {
+    background: #f0f0f0;
+}
\ No newline at end of file
diff --git a/js/admin.js b/js/admin.js
new file mode 100644
index 0000000..1867648
--- /dev/null
+++ b/js/admin.js
@@ -0,0 +1,45 @@
+jQuery(document).ready(function($) {
+    // 初始化日期选择器
+    function initDatepicker() {
+        $('.datepicker').datepicker({
+            dateFormat: 'mm-dd',
+            changeMonth: true,
+            changeYear: false
+        });
+    }
+    
+    // 初始化已有的日期选择器
+    initDatepicker();
+    
+    // 添加新日期
+    $('.add-date').on('click', function() {
+        var dateItem = $('<div class="gray-date-item"></div>');
+        var dateInput = $('<input type="text" name="gray_dates[]" class="datepicker" readonly />');
+        var removeButton = $('<button type="button" class="button remove-date">删除</button>');
+        
+        dateItem.append(dateInput).append(removeButton);
+        $('#gray-dates-list').append(dateItem);
+        
+        // 初始化新添加的日期选择器
+        dateInput.datepicker({
+            dateFormat: 'mm-dd',
+            changeMonth: true,
+            changeYear: false
+        });
+        
+        // 自动打开日期选择器
+        dateInput.datepicker('show');
+    });
+    
+    // 删除日期（使用事件委托）
+    $('#gray-dates-list').on('click', '.remove-date', function() {
+        var dateItem = $(this).parent('.gray-date-item');
+        
+        // 如果只有一个日期项，则清空而不是删除
+        if ($('.gray-date-item').length === 1) {
+            dateItem.find('input').val('');
+        } else {
+            dateItem.remove();
+        }
+    });
+});
\ No newline at end of file
diff --git a/templates/admin-page.php b/templates/admin-page.php
new file mode 100644
index 0000000..993fa48
--- /dev/null
+++ b/templates/admin-page.php
@@ -0,0 +1,36 @@
+<div class="wrap">
+    <h1><?php echo esc_html(get_admin_page_title()); ?></h1>
+    
+    <?php settings_errors('wp_gray_dates_messages'); ?>
+    
+    <form method="post" action="">
+        <?php wp_nonce_field('wp_gray_dates_nonce'); ?>
+        
+        <div class="gray-dates-container">
+            <h2>设置灰色日期</h2>
+            <p class="description">在以下日期，网站将自动变为灰色。格式：MM-DD（每年的这一天都会变灰）</p>
+            
+            <div id="gray-dates-list">
+                <?php if (!empty($gray_dates)): ?>
+                    <?php foreach ($gray_dates as $date): ?>
+                        <div class="gray-date-item">
+                            <input type="text" name="gray_dates[]" value="<?php echo esc_attr($date); ?>" class="datepicker" readonly />
+                            <button type="button" class="button remove-date">删除</button>
+                        </div>
+                    <?php endforeach; ?>
+                <?php else: ?>
+                    <div class="gray-date-item">
+                        <input type="text" name="gray_dates[]" value="" class="datepicker" readonly />
+                        <button type="button" class="button remove-date">删除</button>
+                    </div>
+                <?php endif; ?>
+            </div>
+            
+            <button type="button" class="button add-date">添加日期</button>
+        </div>
+        
+        <p class="submit">
+            <input type="submit" name="wp_gray_dates_save" class="button-primary" value="保存设置" />
+        </p>
+    </form>
+</div>
\ No newline at end of file
diff --git a/wp-gray-dates.php b/wp-gray-dates.php
new file mode 100644
index 0000000..80b3598
--- /dev/null
+++ b/wp-gray-dates.php
@@ -0,0 +1,225 @@
+<?php
+/**
+ * Plugin Name: WP Gray Dates
+ * Plugin URI: 
+ * Description: 在设定的特定日期（月-日）自动将网站变为灰色，每年的这些日期都会自动变灰。
+ * Version: 1.0.0
+ * Author: 林海草原
+ * Author URI: https://lhcy.org
+ * License: GPL-2.0+
+ * License URI: http://www.gnu.org/licenses/gpl-2.0.txt
+ * Text Domain: wp-gray-dates
+ */
+
+// 如果直接访问此文件，则中止执行
+if (!defined('ABSPATH')) {
+    exit;
+}
+
+class WP_Gray_Dates {
+    
+    /**
+     * 插件实例
+     */
+    private static $instance = null;
+    
+    /**
+     * 获取插件实例
+     */
+    public static function get_instance() {
+        if (null === self::$instance) {
+            self::$instance = new self();
+        }
+        return self::$instance;
+    }
+    
+    /**
+     * 构造函数
+     */
+    private function __construct() {
+        // 添加激活和卸载钩子
+        register_activation_hook(__FILE__, array($this, 'activate'));
+        register_deactivation_hook(__FILE__, array($this, 'deactivate'));
+        register_uninstall_hook(__FILE__, array('WP_Gray_Dates', 'uninstall'));
+        
+        // 添加管理菜单
+        add_action('admin_menu', array($this, 'add_admin_menu'));
+        
+        // 添加设置链接
+        add_filter('plugin_action_links_' . plugin_basename(__FILE__), array($this, 'add_settings_link'));
+        
+        // 添加前端样式
+        add_action('wp_head', array($this, 'maybe_add_gray_style'));
+        
+        // 添加管理页面的样式和脚本
+        add_action('admin_enqueue_scripts', array($this, 'enqueue_admin_assets'));
+    }
+    
+    /**
+     * 插件激活时执行
+     */
+    public function activate() {
+        // 创建默认选项
+        $default_options = array(
+            'gray_dates' => array()
+        );
+        
+        add_option('wp_gray_dates_options', $default_options);
+    }
+    
+    /**
+     * 插件停用时执行
+     */
+    public function deactivate() {
+        // 停用时不删除数据
+    }
+    
+    /**
+     * 插件卸载时执行
+     */
+    public static function uninstall() {
+        // 删除所有插件数据
+        delete_option('wp_gray_dates_options');
+    }
+    
+    /**
+     * 添加管理菜单
+     */
+    public function add_admin_menu() {
+        add_options_page(
+            '灰色日期设置', 
+            '灰色日期', 
+            'manage_options', 
+            'wp-gray-dates', 
+            array($this, 'render_admin_page')
+        );
+    }
+    
+    /**
+     * 添加设置链接
+     */
+    public function add_settings_link($links) {
+        $settings_link = '<a href="options-general.php?page=wp-gray-dates">' . __('设置', 'wp-gray-dates') . '</a>';
+        array_unshift($links, $settings_link);
+        return $links;
+    }
+    
+    /**
+     * 加载管理页面的样式和脚本
+     */
+    public function enqueue_admin_assets($hook) {
+        if ('settings_page_wp-gray-dates' !== $hook) {
+            return;
+        }
+        
+        wp_enqueue_style('jquery-ui-datepicker');
+        wp_enqueue_script('jquery-ui-datepicker');
+        
+        // 添加自定义脚本
+        wp_enqueue_script(
+            'wp-gray-dates-admin', 
+            plugins_url('js/admin.js', __FILE__), 
+            array('jquery', 'jquery-ui-datepicker'), 
+            '1.0.0', 
+            true
+        );
+        
+        // 添加自定义样式
+        wp_enqueue_style(
+            'wp-gray-dates-admin', 
+            plugins_url('css/admin.css', __FILE__), 
+            array(), 
+            '1.0.0'
+        );
+        
+        // 本地化脚本
+        wp_localize_script('wp-gray-dates-admin', 'wpGrayDates', array(
+            'ajaxUrl' => admin_url('admin-ajax.php'),
+            'nonce' => wp_create_nonce('wp-gray-dates-nonce'),
+        ));
+    }
+    
+    /**
+     * 渲染管理页面
+     */
+    public function render_admin_page() {
+        // 检查用户权限
+        if (!current_user_can('manage_options')) {
+            return;
+        }
+        
+        // 保存设置
+        if (isset($_POST['wp_gray_dates_save']) && check_admin_referer('wp_gray_dates_nonce')) {
+            $this->save_settings();
+        }
+        
+        // 获取当前设置
+        $options = get_option('wp_gray_dates_options', array('gray_dates' => array()));
+        $gray_dates = $options['gray_dates'];
+        
+        // 包含管理页面模板
+        include plugin_dir_path(__FILE__) . 'templates/admin-page.php';
+    }
+    
+    /**
+     * 保存设置
+     */
+    private function save_settings() {
+        $options = array();
+        
+        // 处理日期数据
+        $options['gray_dates'] = array();
+        
+        if (isset($_POST['gray_dates']) && is_array($_POST['gray_dates'])) {
+            foreach ($_POST['gray_dates'] as $date) {
+                if (!empty($date)) {
+                    // 确保日期格式为 MM-DD
+                    $date = sanitize_text_field($date);
+                    // 验证日期格式
+                    if (preg_match('/^\d{2}-\d{2}$/', $date)) {
+                        $options['gray_dates'][] = $date;
+                    }
+                }
+            }
+        }
+        
+        // 更新选项
+        update_option('wp_gray_dates_options', $options);
+        
+        // 添加成功消息
+        add_settings_error(
+            'wp_gray_dates_messages',
+            'wp_gray_dates_message',
+            __('设置已保存。', 'wp-gray-dates'),
+            'updated'
+        );
+    }
+    
+    /**
+     * 检查当前日期是否应该应用灰色样式
+     */
+    public function maybe_add_gray_style() {
+        $options = get_option('wp_gray_dates_options', array('gray_dates' => array()));
+        $gray_dates = $options['gray_dates'];
+        
+        $today = date('m-d');
+        
+        if (in_array($today, $gray_dates)) {
+            echo '<style>
+                html {
+                    filter: grayscale(100%);
+                    -webkit-filter: grayscale(100%);
+                    -moz-filter: grayscale(100%);
+                    -ms-filter: grayscale(100%);
+                    -o-filter: grayscale(100%);
+                }
+            </style>';
+        }
+    }
+}
+
+// 初始化插件
+function wp_gray_dates_init() {
+    WP_Gray_Dates::get_instance();
+}
+add_action('plugins_loaded', 'wp_gray_dates_init');
\ No newline at end of file