Skip to content

ShoperGamer/SlicePix

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 

Repository files navigation

SlicePix ✂️

License: MIT Open Source Version

เว็บแอปพลิเคชันโอเพนซอร์สที่ช่วยให้คุณ ✂️ แบ่งภาพถ่ายออกเป็นส่วนย่อย ๆ ได้อย่างง่ายดายและรวดเร็ว ไม่ว่าจะเป็นการสร้างภาพ Grid สำหรับ Instagram หรือเตรียมภาพสำหรับเว็บไซต์



✨ คุณสมบัติเด่น (Key Features)

  • 🖼️ อัปโหลดภาพแบบง่าย: รองรับการลากและวางไฟล์ (Drag & Drop) สำหรับภาพ JPG, PNG
  • ⚙️ ตัวเลือกการแบ่งที่ยืดหยุ่น:
    • ↔️ แนวนอน (Horizontal): แบ่งเป็นแถว
    • ↕️ แนวตั้ง (Vertical): แบ่งเป็นคอลัมน์
    • ⏹️ ตาราง (Grid): แบ่งเป็นตาราง (แถว x คอลัมน์)
  • 👀 แสดงผลแบบเรียลไทม์: เห็นเส้นกริดแบ่งภาพทันทีขณะปรับค่า
  • 🛡️ ปลอดภัยและรวดเร็ว: ประมวลผลบนเบราว์เซอร์ของคุณโดยตรง ไม่มีการอัปโหลดไฟล์ขึ้นเซิร์ฟเวอร์
  • 📥 ดาวน์โหลดได้หลายรูปแบบ:
    • ⬇️ ดาวน์โหลดแยกแต่ละส่วน
    • 📦 ดาวน์โหลดทั้งหมดเป็นไฟล์ ZIP
  • 🌗 รองรับ Light/Dark Mode: อินเทอร์เฟซสบายตาในทุกสภาพแสง

🛠️ เทคโนโลยีที่ใช้ (Built With)

HTML5 CSS3 JavaScript Tailwind CSS


📖 วิธีใช้งาน (How to Use)

ขั้นตอนที่ 1: อัปโหลดภาพของคุณ

ลากไฟล์ภาพมาวางในพื้นที่อัปโหลด หรือคลิกเพื่อเลือกไฟล์

ขั้นตอนที่ 2: ตั้งค่าการแบ่งภาพ

เลือกรูปแบบการแบ่ง: "แนวนอน", "แนวตั้ง" หรือ "ตาราง" กำหนดจำนวนส่วนที่ต้องการ และตรวจสอบเส้นกริดบนภาพตัวอย่าง

ขั้นตอนที่ 3: เริ่มประมวลผลและดาวน์โหลด

คลิกปุ่ม "เริ่มแบ่งภาพ" ดาวน์โหลดภาพที่คุณต้องการทีละภาพ หรือดาวน์โหลดทั้งหมดเป็นไฟล์ ZIP


💻 การติดตั้งและรันบนเครื่องของคุณ (Local Setup)

หากคุณต้องการแก้ไขหรือรันโปรเจกต์นี้บนเครื่องคอมพิวเตอร์ของคุณ ทำตามขั้นตอนต่อไปนี้

  1. Clone the repository
    git clone [https://github.com/](https://github.com/)[your-github-username]/slicepix.git
  2. Navigate to the project directory
    cd slicepix
  3. Open index.html in your browser เพียงแค่ดับเบิลคลิกไฟล์ index.html หรือเปิดผ่านเบราว์เซอร์โดยตรง

❤️ การสนับสนุน (Contributing)

เรายินดีต้อนรับการมีส่วนร่วมทุกรูปแบบ! ไม่ว่าจะเป็นการแจ้งบั๊ก, เสนอคุณสมบัติใหม่, หรือการส่ง Pull Request

  1. Fork a project
  2. สร้าง Branch ของคุณ (git checkout -b feature/AmazingFeature)
  3. Commit การเปลี่ยนแปลง (git commit -m 'Add some AmazingFeature')
  4. Push ไปยัง Branch (git push origin feature/AmazingFeature)
  5. เปิด Pull Request

📜 สัญญาอนุญาต (License)

โปรเจกต์นี้อยู่ภายใต้สัญญาอนุญาต MIT ดูรายละเอียดเพิ่มเติมได้ที่ไฟล์ LICENSE


English Version

SlicePix ✂️

License: MIT Open Source Version

An open-source web application that helps you ✂️ easily and quickly split photos into smaller sections. Perfect for creating Instagram grids or preparing images for websites.



✨ Key Features

  • 🖼️ Simple Image Upload: Supports drag-and-drop for JPG, PNG files.
  • ⚙️ Flexible Splitting Options:
    • ↔️ Horizontal: Split into rows.
    • ↕️ Vertical: Split into columns.
    • ⏹️ Grid: Split into a grid (rows x columns).
  • 👀 Real-time Preview: See a grid overlay on your image as you adjust the settings.
  • 🛡️ Secure and Fast: All processing is done directly in your browser; no files are ever uploaded to a server.
  • 📥 Multiple Download Options:
    • ⬇️ Download individual sections.
    • 📦 Download all sections as a ZIP file.
  • 🌗 Light/Dark Mode Support: A comfortable interface for all lighting conditions.

🛠️ Built With

HTML5 CSS3 JavaScript Tailwind CSS


📖 How to Use

Step 1: Upload Your Image

Drag and drop your image file into the upload area, or click to select a file.

Step 2: Configure Split Settings

Choose your split format: "Horizontal", "Vertical", or "Grid". Set the desired number of parts and check the grid overlay on the preview image.

Step 3: Process and Download

Click the "Split Image" button. Download the images you need individually or download all of them as a ZIP file.


💻 Local Setup

If you wish to modify or run this project on your local machine, follow these steps:

  1. Clone the repository
    git clone [https://github.com/](https://github.com/)[your-github-username]/slicepix.git
  2. Navigate to the project directory
    cd slicepix
  3. Open index.html in your browser Simply double-click the index.html file or open it directly in your browser.

❤️ Contributing

We welcome contributions of all kinds! Whether it's reporting bugs, suggesting new features, or submitting a Pull Request.

  1. Fork the project
  2. Create your feature branch (git checkout -b feature/AmazingFeature)
  3. Commit your changes (git commit -m 'Add some AmazingFeature')
  4. Push to the branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

📜 License

This project is licensed under the MIT License. See the LICENSE file for more details.

About

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors