
Credits

Md Shahanab Uddin

Amit Pathania

Divyesh Vasani
Founded
2024
Location
Seattle, Washington, US
Company size
11-50
Industry
Legal tech (personal injury)
Capabilities
Website
Alpha Law makes AI-powered case management software for personal injury law firms. The platform runs a case from intake to settlement, with AI intake that qualifies leads, a demand letter generator, a medical chronology builder, deadline tracking, client texting and a settlement negotiation tracker. The company is based in the Seattle area and says its product was built by a leading PI law firm and top technologists.
By the time its new website shipped in April 2026, Alpha Law’s product had been in market for over a year. The site had to speak to the people who run personal injury practices, and to the intake teams, paralegals and case managers who use the software every day.
Rango designed and built Alpha Law’s marketing website. The work covered the type system, the color language and a Next.js site, designed and built together.
At a glance
Client: Alpha Law, AI-powered case management software for personal injury law firms, based in the Seattle area (founded 2024)
Who the site is for: personal injury firms, from the people who choose their software to the intake teams, paralegals and case managers who use it
What we did: Rango designed Alpha Law’s type system, color language and marketing website, and built the site in Next.js with Tailwind CSS v4
Design: Md Shahanab Uddin and Amit Pathania
Front end: Divyesh Vasani, in Next.js and Tailwind CSS v4
Live: since April 2026, at alphalaw.io
The brief
Earn a law firm’s trust before the demo.
A personal injury firm runs on intake calls, deadlines and medical records, and its client data has to stay safe. Alpha Law’s FAQ addresses implementation, AI accuracy, data access, security and staff adoption:
How long does it take to implement the platform?
Will the AI make mistakes with my cases?
What happens to my data if I decide to leave?
Is my client data secure and compliant?
What if my team isn’t tech-savvy?
So the site pairs product claims with evidence: the people behind the platform, a named customer quote and views of the product. It also explains the support a firm gets, compares workflows with traditional tools, and takes on those questions in its FAQ.
One visual system
Type, color and site, designed together.
We designed the type system, the color language and the website at the same time, so the site reads like one decision, not fifty compromises.
The type. One typeface, Instrument Sans, carries the whole site: weight 600 for headings, figures and buttons, 500 for the large customer quote and 400 for body text.
The color. A near-black green, #0D1814, is the ground of the dark sections, including the figures, the stage cards and the footer, while the hero sits on light grey. One green, #027B51, marks the actions, like the Book a Demo buttons, with a deeper #015A3C on hover. Lime, #DAFFC2, marks section labels and the words that matter, like “every stage”. A warm neutral, #E0E0C7, draws the hairlines between sections. Blue, #1D83D0, is kept for three moments: the customer quote, the support section and the demo invitation.

The icon set in the design: Lucide line icons on a shared keyline grid.
The website
From the product to the hard questions.
The homepage introduces the product and the people behind it, presents a customer quote and platform figures, walks through the case lifecycle, and then covers features, support, a comparison with traditional tools and common questions.

The homepage hero in the design: what the product is, what it manages, one button, and the firm and technologists behind it.
Note: the hero and stage images on this page come from the design files, so some of their copy differs from the live site.
What it is, and who is behind it. The hero names the product in plain words and leads with one action: book a demo. Under it, a proof strip says who built the product, a personal injury firm and technologists, with their logos. The live hero now opens with “Your Firm Supercharged by AI” and adds a second button, Platform Overview, which opens a product video.
For each role. Beside the hero, a looping product video carries three role labels, Intake, Paralegal and Case Manager, so each person on a firm’s team sees their job named.
Proof before features. Next comes a quote from Josh Brumley, CEO of Brumley Law Firm in Seattle: “Over the past 12 months, we’ve doubled in size in large part due to the operational leverage and efficiency their platform provides.” The next section presents Alpha Law’s own platform claims: 2.3M in additional revenue captured per firm annually, 3x more cases handled without adding staff, and 60% faster case processing from intake to settlement.

Alpha Law’s own platform claims. On the live site, these counters animate into view.
Every stage of a case. The platform section follows a personal injury case through three stages. Each is a card that stacks on the one before as you scroll:
Intake and Evaluation. Capture every opportunity, qualify every lead: AI intake qualifies prospects, pulls out key case details and escalates to the firm’s team.
Pre-Litigation. Build stronger cases, faster: demand letters, medical record analysis and settlement negotiation tracking.
Litigation. Stay ahead of every deadline: case calendaring, chat with case and built-in e-sign.

The three stages stack as you scroll: intake and evaluation, pre-litigation, litigation.
Each card pairs one promise with a view of the product at that stage, so readers can see the relevant interface beside the description.

Stage 01 in the design: the stage, one promise, a supporting description, one button, and the product beside it.

A product view from the design, with sample data: calls management, with each call linked to its case.
What’s built in. Eight features sit in one grid: AI-powered reception and intake, key performance indicators, chat with case, a demand letter generator, a medical chronology builder, deadline and task management, client texting and a settlement negotiation tracker. On desktop, hovering a card reveals what it does in one line.

The features grid: hover a card for a one-line description.
After the signature. The support section, in the accent blue, promises 24/7 help from specialists who understand personal injury practice, onboarding and migration in days rather than months, free training and quarterly business reviews. A comparison then sets Alpha Law against traditional tools, row by row: case organization, document work, case progress, medical records and client communication.
The questions firms ask. The FAQ covers implementation, AI accuracy, data access on leaving, security and staff adoption, and the page ends with an invitation to a customized demo.
On a phone. The recording below shows the hero, the customer quote, the figures and the stage cards at phone width.

The homepage at phone width: the hero, the customer quote, the figures and the stage cards.
The build
Next.js, with the brand in the code.
Divyesh Vasani built the site in Next.js with Tailwind CSS v4. The colors are named theme tokens in the code: brand-dark, brand-primary, brand-primary-dark, brand-secondary and brand-tertiary. The homepage is prerendered and served from Vercel’s cache.
Three motion details do real work: the figures count up when they scroll into view, the stage cards stack in order, and, on desktop, the feature cards reveal their description on hover.
Six months later
Live since April 2026, with the visual system and core sections still in use.
The new site went live in April 2026. The Internet Archive’s first capture of it is from 9 April. On 13 October 2026, the live homepage still used the color tokens, the three stage cards, the published platform figures and the FAQ described here.
The figures quoted earlier are Alpha Law’s published claims about its platform, not measurements of the website.
What legal tech teams can take from this
Answer the hard questions on the page. Firms ask whether the AI makes mistakes, whether their data is safe and what happens if they leave. Answer in the FAQ, before the demo form.
Organize by the case, not by the feature list. Show what the product does at each stage a firm already knows: intake, pre-litigation, litigation.
Name the roles. Intake staff, paralegals and case managers should each see their job named on the page.
Make the source of proof clear. Alpha Law’s homepage places a named customer quote and its own published platform figures directly below the hero. Attribute each to its source.
Design the type, color and site together. Choices made on real pages still work once the product views, figures and forms arrive.
Questions about this project
What did Rango do for Alpha Law? Rango designed Alpha Law’s marketing website, including its type system and color language, and built it in Next.js with Tailwind CSS v4.
What is Alpha Law? AI-powered case management software for personal injury law firms, founded in 2024 and based in the Seattle area. It covers intake, pre-litigation and litigation, with tools such as a demand letter generator, a medical chronology builder and a settlement negotiation tracker.
What is the site built with? Alpha Law’s marketing website is built with Next.js and Tailwind CSS v4 and served from Vercel.
When did Alpha Law’s website launch? In April 2026. The Internet Archive first captured the current site on 9 April 2026.
Can Rango design a website for legal tech software or a law firm? Yes. Rango designs and builds websites in Next.js, Framer and Webflow. For Alpha Law, the audience was law firms evaluating case management software. A law firm’s own website is shaped around its services and prospective clients instead, but both start with clear information, evidence a reader can check and one clear next step.
Building software for law firms or other professional buyers, or planning a new site for your firm? See how we approach B2B website design, or how we build in Next.js.
Share on
Previous
Next
