Generator Meter HTML
Buat elemen <meter> — atur rentang min/maks, nilai saat ini, dan ambang low/high/optimum, lalu salin HTML siap pakai. Gratis, instan, tanpa AI.
Input
Pengaturan
Nilai di bawah ini dianggap rendah.
Nilai di atas ini dianggap tinggi.
Nilai ideal. Browser mewarnai meter berdasarkan seberapa jauh nilai dari nilai ideal tersebut.
Tambahkan kelas CSS kustom ke elemen. Pisahkan beberapa kelas dengan spasi.
Output
Elemen Anda akan muncul di sini.
Cara lain menggunakan alat ini
REST API
curl -X POST https://api.iotools.cloud/v1/tool/html-generator/meter \
-H "Authorization: Bearer YOUR_API_KEY" \
-H "Content-Type: application/json" \
-d '{
"customMin": "0",
"customMax": "100",
"customValue": "60",
"customLabel": "",
"customLow": "",
"customHigh": "",
"customOptimum": "",
"customClasses": ""
}'Ganti dengan kunci Anda sendiri dari akun Anda. Bidang alat menjadi isi permintaan — tanpa pembungkus.
Tanyakan ke agen AI
Use the IOTools `html-generator__meter` tool (HTML Meter Generator) on this input:
YOUR_INPUT_HERETempelkan ini ke agen mana pun yang terhubung ke server MCP IOTools, lalu tambahkan input Anda.
Widget sematan
<iframe
src="https://iotools.cloud/embed/html-generator/meter/"
width="100%" height="520" frameborder="0" scrolling="no" loading="lazy"
title="Generator Meter HTML — iotools.cloud"
sandbox="allow-scripts allow-forms allow-same-origin allow-downloads allow-popups allow-popups-to-escape-sandbox"
allow="clipboard-write"
style="width:100%;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden"></iframe>
<script src="https://iotools.cloud/embed.js" async></script>Tempelkan ini di halaman Anda sendiri — gratis, tanpa kunci, cukup tautan balik.
| Biaya per panggilan API/MCP | Mulai dari 5 kredit |
|---|---|
| Butuh kredit lebih? | Lihat harga |
Juga tersedia melalui
Panduan
Buat gauge <meter> yang siap ditempel — atur rentangnya, nilai saat ini, dan ambang low/high/optimum opsional, lalu salin HTML yang dihasilkan.
Berjalan sepenuhnya di browser Anda: tanpa panggilan AI, tanpa kredit, tanpa perjalanan jaringan. Output diperbarui seketika saat Anda mengetik.
Cara menggunakan
- Atur Nilai Minimum, Nilai Maksimum dan Nilai Saat Ini.
- Opsional, tambahkan Label dan ambang Rendah, Tinggi dan Optimum. Browser akan mewarnai gauge hijau, kuning atau merah tergantung di mana nilainya berada terhadap ambang tersebut.
- Salin atau unduh HTML yang dihasilkan.
Meter atau bar progres?
Gunakan <meter> untuk pengukuran dalam rentang yang diketahui (penggunaan disk, skor, level baterai). Gunakan <progress> untuk penyelesaian suatu tugas — lihat HTML Progress Bar Generator.
Mengapa tidak ada pratinjau langsung?
Output berupa markup asli yang tidak disanitasi, sehingga merendernya langsung di halaman tidak aman. Tempel kode ke halaman Anda sendiri untuk melihatnya dalam konteks.