Rounds — Free Hospital Management System Template
Rounds is a hospital management system template that reads like clinical software rather than a generic admin kit. A navy sidebar and a live census strip frame each screen, figures are set in IBM Plex Mono, and colour carries meaning: coral for critical alerts and allergies, amber for warnings, teal for free beds and arrivals. Seven pages cover the daily work of a hospital: the bed meeting, the inpatient list, a patient record, outpatient clinics, the bed board, the staff rota and sign-in. All data is fictional, so you can swap in your own.
Key features
- Overview dashboard with SVG bed occupancy by ward, a patient flow line chart, ED triage status, critical alerts and staff on duty
- Inpatient list with live search, ward, status and attending-doctor filters, sortable columns, pagination and CSV export
- Admit-patient offcanvas form with validation that adds the new patient to the list
- Patient record with a wristband-style header, allergy banner, 72-hour vitals chart in a bedside-monitor style, medications, lab results with range bars and abnormal flags, and a clinical notes timeline
- OPD appointment board by doctor and 30-minute slot, with day navigation, a clinic filter and a book-appointment dialog that checks slot availability
- Ward bed map showing occupied, free, cleaning and reserved beds, a bed queue, a mark-clean action and an assign-bed dialog
- Weekly staff roster with day, early, late, night and on-call shifts, role and department filters, week navigation and coverage against required numbers
- Collapsible sidebar that becomes an offcanvas drawer on mobile, plus a light and dark theme toggle
- Keyboard-accessible charts with data-table fallbacks, a skip link, labelled forms and visible focus styles
Best for
- Hospital management system (HMS) front ends and prototypes
- Clinic, outpatient and ward operations dashboards
- Bed management and patient flow tools
- Healthcare startups designing an admin panel before building the backend
At a glance
- Bootstrap 5.3.8 with vanilla JavaScript, no jQuery
- 7 pages: index.html, patients.html, patient.html, appointments.html, beds.html, staff.html, login.html
- Hand-built SVG charts drawn from small data arrays in js/main.js, no chart library
- IBM Plex Sans and IBM Plex Mono with tabular figures; palette and type set as CSS custom properties
- Light and dark themes, responsive down to 375px
- Free for personal and commercial use; attribution optional but welcome. Full terms: uicookies.com/license
How to use it
Unzip the folder and open index.html in a browser; no build step is needed. Edit the page copy and tables in the HTML files, and the chart data in the DATA block at the top of js/main.js. Colours, fonts and spacing live as custom properties at the top of css/style.css. The forms validate in the browser only, so connect them to your backend or a form service. Deploy the folder to any static host.
Frequently asked questions
Is Rounds free for commercial projects?
Yes. Rounds is free for personal and commercial use, including client work. Attribution is optional but always welcome. The full terms are at uicookies.com/license.
What is it built with?
Bootstrap 5.3.8 and plain vanilla JavaScript, with no jQuery and no chart library. The charts are inline SVG generated from small data arrays in js/main.js, and Bootstrap’s own bundle handles the offcanvas panels, dialogs and dropdowns.
Which pages are included?
Seven: a hospital overview dashboard, an inpatient list, a patient record, an OPD appointment board, a ward bed map, a staff roster and a sign-in page. They share one sidebar, topbar and census strip, so adding a page means copying one file.
Does it save patients, bookings or notes?
No. The admit, booking, assign-bed, note and sign-in forms validate in the browser and update the page, but nothing is stored. Connect them to your hospital system or API to save data. All names and records in the demo are fictional.
Can I change the wards, clinics and chart data?
Yes. Ward occupancy, patient flow and vitals chart data sit in the DATA block at the top of js/main.js. The bed map, appointment board and roster are plain HTML, and the script reads them from the page, so editing the markup is enough.
