HTML / CSS / JS template

Launch a polished AI job-search or recruiting website without starting from a blank page.

Orion gives you 11 responsive, connected HTML pages for presenting job matches, listings, application activity, salary insights, and plans. The careers theme demonstrates the design, but does not limit it: replace the branding, copy, imagery, and sections to adapt the template to another industry, digital product, client website, or internal project. Edit the plain HTML, one CSS file, and one JavaScript file—no framework or build step required. It is a front-end template; AI matching, live job data, and application processing must be connected separately.

DOWNLOAD NOW View live demo

Homepage scroll · index.html

What's included

A complete front-end foundation for career technology products.

Use the included screens for an AI job-search product, recruiting SaaS, career portal, or hiring marketplace. Replace the demo brand, roles, scores, and copy with your own content; match percentages are presentation data, not generated results.

11 purpose-built pages

Home, jobs, matches, dashboard, insights, pricing, about, apply, contact, login, and 404—all supplied as separate, editable HTML files.

Fast visual rebranding

Change the --lime CSS token to update buttons, badges, and score rings throughout the design. The inner pages carry the same dark gradient system as the homepage.

Responsive navigation included

Jobs and Insights dropdowns work on desktop, while screens under 720px use a hamburger menu. The search overlay and notification panel are also wired.

Full-screen search experience

The navigation opens a polished search overlay with a field and popular tags, ready for connection to your own search logic. It does not filter content by default.

Interactive application controls

Auto-apply filter chips and Profile, Resume, and Cover note switches provide working selected states for realistic product demos; they do not change the sample cards.

Ready-to-connect forms

Apply, contact, login, and footer search layouts are included with demo feedback states. Connect them to your own authentication, form, or application backend.

Job-match UI components

Present fit scores with styled rings, badges, match cards, and a 0–100 scale. Values are editable in the HTML, so you control what each demo displays.

Four-tier plan layout

The included pricing.html page provides four plan cards for presenting subscriptions or service tiers. The current navigation labels that page Salary.

Modern visual system

Glass cards, ambient gradients, Space Grotesk, Remix Icon, and selected Unsplash portraits create a cohesive career-tech look. These external assets require an internet connection unless hosted locally.

Live demo

Explore the complete template in your browser.

Open all 11 responsive pages, try the navigation, and test the included interactions before purchasing.

Open the Orion live demo Launches in a new browser tab

The public demo uses optimized assets and does not include the downloadable source package.

The pages

Eleven real pages for the full candidate journey.

Each navigation destination is its own HTML file, giving you direct control over every screen and a clear starting point for backend integration.

index.html Home hero, auto-apply queue, score, testimonials
jobs.html Role listings with a filter sidebar
candidates.html My Matches grid
dashboard.html Greeting and sample activity for Alex — the dock CSS lives on the home page
insights.html Career intelligence cards
pricing.html Four plan cards (Salary in the nav)
about.html Company story
apply.html Application form demo
contact.html Contact form demo
login.html Sign-in layout
404.html Missing-page screen

Mobile friendly

A responsive experience from desktop dashboards to phones.

Layouts collapse to one column below 1100px. Below 720px, navigation becomes a hamburger and the Jobs and Insights controls link directly to their pages.

Orion home hero on a phone with hamburger nav — Home · 390px

Orion hamburger menu open on a phone — Menu open · 390px

Orion jobs page on a phone — Jobs · 390px

Hero copy and floating score cards stack
Filter chips wrap instead of clipping
Hamburger opens the page links. Jobs / Insights hover menus hide under 720px and those buttons go to their pages

Easy to edit

Organized source files make customization straightforward.

Comments map the homepage sections, CSS tokens and breakpoints, plus the JavaScript for menus, overlays, alerts, toggles, reveals, and demo forms.

index.html Home blocks plus a list of the other page files.
styles.css Tokens first. 720px notes that dropdowns hide and the hamburger appears.
script.js Says search does not filter and forms do not post.

Code editor showing labeled Orion HTML and CSS sections — Comments in the files point to what to edit. This is a stylized editor view of those labels.

Close-up

The homepage in one frame.

Match-score cards, the lime nav, and the auto-apply dock sitting under the headline.

Orion home hero with match score cards — Home

All 11 pages

Scroll each page the way a visitor would.

Desktop width, real height. Click a tile to open the full shot. dashboard.html is shown as it actually opens.

Full Orion home page from top to bottom — `index.html` Home

Full Orion jobs page from top to bottom — `jobs.html` Jobs

Full Orion matches page from top to bottom — `candidates.html` Matches

Full Orion dashboard page as it opens — `dashboard.html` Dashboard

Full Orion insights page from top to bottom — `insights.html` Insights

Full Orion pricing page from top to bottom — `pricing.html` Pricing

Full Orion about page from top to bottom — `about.html` About

Full Orion apply page from top to bottom — `apply.html` Apply

Full Orion contact page from top to bottom — `contact.html` Contact

Full Orion login page — `login.html` Login

In the zip

Everything needed for the editable front end.

You receive the 11 HTML pages, shared stylesheet, interaction script, and documentation. Navigation and reveal effects work out of the box; job data, AI services, authentication, and form delivery are not included.

*.html Eleven pages, sample roles, and form markup
assets/css/styles.css Tokens, glass cards, and phone rules
assets/js/script.js Menus, overlay, alerts, toggles, reveals
readme/ Setup, customization, license

Get the template

Start your career-tech website with 11 polished screens.

Get the responsive HTML, CSS, and vanilla JavaScript source and adapt it for a job platform, recruiting product, or client project.

Instant download after successful payment

Buy now — $15 By purchasing this product, you agree to the Terms and License.

Pay securely with PayPal VISA AMEX

Complete source files HTML, CSS, and JavaScript included

Easy to customize Change the content, colors, and interface details

Detailed instructions Includes a README with setup and customization guidance

Commercial-ready license Use for one project for you or a client

Questions before buying? Visit Tech & ALL.