README.md

metadata

title: CIDR Calculator
emoji: 🌍
colorFrom: indigo
colorTo: gray
sdk: static
pinned: false
license: mit

Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

🌍 Minimalist IPv4 CIDR Calculator

A fast, minimalist, and responsive IPv4 CIDR Calculator designed with a modern Fluent-inspired glassmorphism aesthetic. It runs entirely in the browser and functions completely offline as a Progressive Web App (PWA).

---

✨ Key Features

• Live Subnet Calculation: Instantly calculates network details as you type or change the subnet prefix length.
• Auto-Sync Prefix Input: If you type or paste an IP with a CIDR suffix (e.g., 192.168.1.50/26), the dropdown menu automatically synchronizes and updates the calculation.
• Fluent-Inspired UI: Sleek glassmorphism style card utilizing variable CSS transparency, backdrop filters, and a subtle animated background gradient mesh.
• Tri-Theme Switcher (System / Light / Dark): Cycles through your preferred color themes using a floating action button (FAB).
• One-Click Copying: Copy any calculated subnet property directly to your clipboard using the copy icon buttons next to each field.
• Offline Capable: Full offline support using modern service workers to cache app assets.

---

📖 How to Use

1. Enter an IPv4 Address: Type your IP address in the text field (e.g., 192.168.0.1).
2. Select Prefix Length: Choose your prefix length (from /0 to /32) using the dropdown menu. Alternatively, you can type the CIDR notation directly in the input box (e.g., 10.0.0.1/16) and it will auto-update the prefix dropdown.
3. View Results: The calculation results will appear instantly below the inputs.
4. Copy Results: Click the clipboard icon next to any value to copy it.

📝 Concrete Calculation Example

For an input of 192.168.0.1/24, the calculator displays:

Subnet Property	Calculated Value	Explanation
CIDR Notation	192.168.0.0/24	The standard representation of the subnet.
Network Address	192.168.0.0	The identifier for this specific network.
Broadcast Address	192.168.0.255	The address used to transmit data to all hosts on the subnet.
Subnet Mask	255.255.255.0	The binary mask defining the network vs. host portion of the address.
Usable Host Range	192.168.0.1 – 192.168.0.254	The range of IP addresses assignable to devices on this subnet.
Usable Hosts	254	The total number of valid host addresses (excluding Network & Broadcast).
IP Class	Class C	The historical IP address class based on the first octet.
Route Type	Private (RFC 1918)	Indicates whether the subnet is for private internal routing or public routing.

---

📲 Installing as a PWA (Progressive Web App)

Since this app is a PWA, you can install it on your device and launch it just like a native app. This allows it to work offline without an active internet connection.

Desktop (Chrome, Edge, Brave, etc.)

1. Open the CIDR Calculator in your browser.
2. Look at the right side of the address bar for an Install icon (typically a computer monitor with a download arrow, or a + icon).
3. Click it and confirm Install. The app will launch in its own standalone window and add a shortcut to your desktop/applications menu.

Mobile (iOS Safari, Android Chrome, etc.)

1. Open the CIDR Calculator in your mobile browser.
2. Access the browser's menu (the share sheet icon on iOS Safari, or the three-dot menu on Android Chrome).
3. Tap Add to Home Screen.
4. Confirm the installation. The app icon will appear on your device's home screen.