<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>免费在线工具箱 - 多功能工具集合|在线转换工具|视频音频转换提取|二维码生成</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: "Microsoft YaHei", system-ui, sans-serif;
        }
        body {
            background-color: #f2f5fa;
            padding: 40px 20px;
            min-height: 100vh;
            display: flex;
            flex-direction: column;
        }
        header {
            text-align: center;
            margin-bottom: 50px;
        }
        h1 {
            color: #1967d2;
            font-size: 32px;
            margin-bottom: 10px;
        }
        .subtitle {
            color: #606266;
            font-size: 15px;
        }
        .container {
            max-width: 1100px;
            margin: 0 auto auto;
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
            gap: 26px;
        }
        .tool-card {
            background: #ffffff;
            border-radius: 14px;
            padding: 32px 20px;
            text-align: center;
            box-shadow: 0 3px 14px rgba(0, 0, 0, 0.07);
            transition: all 0.25s ease;
            cursor: pointer;
        }
        .tool-card:hover {
            transform: translateY(-6px);
            box-shadow: 0 6px 20px rgba(25, 103, 210, 0.16);
        }
        .tool-icon {
            font-size: 46px;
            margin-bottom: 16px;
        }
        .tool-name {
            font-size: 18px;
            color: #222;
            font-weight: 500;
            margin-bottom: 8px;
        }
        .tool-desc {
            font-size: 13px;
            color: #777;
            line-height: 1.5;
        }
        .soon-box {
            margin-top: 60px;
            text-align: center;
            color: #909399;
            font-size: 14px;
        }
    </style>
</head>
<body>
    <header>
        <h1>免费在线工具箱</h1>
        <p class="subtitle">各类实用在线工具合集，本地处理，安全无上传，更多功能持续更新</p>
    </header>

    <div class="container">
        <!-- 工具1：MP4提取MP3 -->
        <div class="tool-card" onclick="location.href='mp4tomp3.html'">
            <div class="tool-icon">🎬</div>
            <div class="tool-name">MP4提取MP3音频</div>
            <div class="tool-desc">上传视频一键分离音频，导出MP3文件</div>
        </div>

        <!-- 工具2：二维码生成解析 -->
        <div class="tool-card" onclick="location.href='qrcode.html'">
            <div class="tool-icon">📱</div>
            <div class="tool-name">二维码工具</div>
            <div class="tool-desc">文字生成二维码 / 图片识别解析二维码</div>
        </div>

        <!-- 工具3：CSV在线解析可视化表格 -->
        <div class="tool-card" onclick="location.href='csv.html'">
            <div class="tool-icon">📊</div>
            <div class="tool-name">CSV 在线解析可视化表格</div>
            <div class="tool-desc">CSV文件在线读取，直接转为可视化表格查看</div>
        </div>
    </div>

    <div class="soon-box">
        <p>更多工具正在开发中：图片压缩、JSON格式化、进制转换、时间戳工具等</p>
    </div>

    <!-- 底部版权备案信息 -->
    <div style="text-align:center; padding:15px 10px; font-size:14px; color:#777; line-height:1.8; margin-top:60px;">
        ©2026 东莞市大朗易家智能产品经营部 版权所有<br>
        <a href="https://beian.miit.gov.cn/" target="_blank" style="color:#777; text-decoration:none;">粤ICP备2020135096号</a>
    </div>
</body>
</html>