Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 20 additions & 2 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
"@context": "https://schema.org",
"@type": "SoftwareApplication",
"name": "CAD Viewer",
"description": "Open STEP, IGES, STL, OBJ, and more CAD formats instantly in your browser. Orbit, measure edges, apply section planes, and export snapshots — no install required.",
"description": "Open STEP, IGES, STL, OBJ, and more CAD formats instantly in your browser, then generate a fully dimensioned, true-to-scale 2D engineering drawing — no install required.",
"url": "https://cadviewer.xyz/",
"applicationCategory": "DesignApplication",
"operatingSystem": "Web",
Expand All @@ -39,10 +39,11 @@
},
"featureList": [
"3D viewing for CAD and mesh formats",
"Automatic 2D engineering drawing generation with true-to-scale PDF export",
"Assembly explode and disassemble with per-part STEP export",
"Measurement tools",
"Section/cross-section controls",
"Snapshot capture (normal and outline)",
"Assembly/part-focused workflows",
"DXF preview support"
]
}
Expand All @@ -56,6 +57,23 @@
"url": "https://cadviewer.xyz/"
}
</script>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "CADViewer",
"url": "https://cadviewer.xyz/",
"logo": "https://cadviewer.xyz/favicon.svg",
"founder": {
"@type": "Person",
"name": "Devaraj"
},
"sameAs": [
"https://github.com/devaraj3/cad_viewer",
"https://www.linkedin.com/in/devaraj1/"
]
}
</script>
<style>
html, body, #root { height: 100%; }
body { margin: 0; overflow: hidden; }
Expand Down
18 changes: 14 additions & 4 deletions public/llms.txt
Original file line number Diff line number Diff line change
@@ -1,27 +1,37 @@
# CAD Viewer

> Free, browser-based 3D CAD viewer supporting STEP, IGES, STL, OBJ, 3MF, BREP, GLB, and DXF files — no install, no account, no subscription.
> Free, browser-based 3D CAD viewer and 2D engineering drawing generator
> supporting STEP, IGES, STL, OBJ, 3MF, BREP, GLB, and DXF files — no
> install, no account, no subscription.

CAD Viewer is an open-source, in-browser CAD file viewer built on the OpenCascade (OCCT) engine. It runs entirely client-side and requires no software installation or account signup.
CAD Viewer is an open-source, in-browser CAD file viewer built on the
OpenCascade (OCCT) engine. It runs entirely client-side and requires no
software installation or account signup.

## Features
- 3D viewing for CAD and mesh formats
- Automatic 2D engineering drawing generation with true-to-scale PDF export
(third-angle projection, standard dimensioning)
- Assembly explode/disassemble with per-part STEP export
- Measurement tools
- Section/cross-section controls
- Snapshot capture (normal and outline)
- Assembly/part-focused workflows
- DXF preview support

## Supported formats
- CAD solids: STEP, STP, IGES, IGS, BREP
- Mesh/assembly formats: STL, OBJ, 3MF, GLTF, GLB
- 2D drawing format: DXF
- 2D drawing format: DXF (import), PDF (drawing export)

## Pricing
Free to use, no subscription required.

## Guides
- [How to Split a STEP Assembly Into Separate Part Files (Free, Online)](https://cadviewer.xyz/guides/split-step-assembly)
- [How to Turn a STEP File into a 2D Engineering Drawing (Free)](https://cadviewer.xyz/guides/step-file-to-2d-drawing)

## About
[About CADViewer](https://cadviewer.xyz/about)

## Live app
[CAD Viewer](https://cadviewer.xyz/)
14 changes: 10 additions & 4 deletions public/sitemap.xml
Original file line number Diff line number Diff line change
Expand Up @@ -2,25 +2,31 @@
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>https://cadviewer.xyz/</loc>
<lastmod>2026-08-22</lastmod>
<lastmod>2026-08-23</lastmod>
<changefreq>weekly</changefreq>
<priority>1</priority>
</url>
<url>
<loc>https://cadviewer.xyz/about</loc>
<lastmod>2026-08-23</lastmod>
<changefreq>monthly</changefreq>
<priority>0.6</priority>
</url>
<url>
<loc>https://cadviewer.xyz/viewer</loc>
<lastmod>2026-08-22</lastmod>
<lastmod>2026-08-23</lastmod>
<changefreq>monthly</changefreq>
<priority>0.8</priority>
</url>
<url>
<loc>https://cadviewer.xyz/guides/split-step-assembly</loc>
<lastmod>2026-08-22</lastmod>
<lastmod>2026-08-23</lastmod>
<changefreq>monthly</changefreq>
<priority>0.9</priority>
</url>
<url>
<loc>https://cadviewer.xyz/guides/step-file-to-2d-drawing</loc>
<lastmod>2026-08-22</lastmod>
<lastmod>2026-08-23</lastmod>
<changefreq>monthly</changefreq>
<priority>0.9</priority>
</url>
Expand Down
2 changes: 2 additions & 0 deletions src/main.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import { lazy, Suspense } from "react";
import { ClientOnly, Head, ViteReactSSG } from "vite-react-ssg";
import type { RouteRecord } from "vite-react-ssg";
import About from "./pages/About";
import Landing from "./pages/Landing";
import SplitStepAssembly from "./pages/guides/SplitStepAssembly";
import StepFileTo2dDrawing from "./pages/guides/StepFileTo2dDrawing";
Expand Down Expand Up @@ -50,6 +51,7 @@ function NotFound() {

export const routes: RouteRecord[] = [
{ path: "/", element: <Landing /> },
{ path: "/about", Component: About },
{ path: "/guides/split-step-assembly", Component: SplitStepAssembly },
{
path: "/guides/step-file-to-2d-drawing",
Expand Down
126 changes: 126 additions & 0 deletions src/pages/About.module.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,126 @@
:global(body.about-page) {
overflow-y: auto;
height: auto;
min-height: 100vh;
}

:global(body.about-page #root) {
height: auto;
min-height: 100vh;
}

.page {
min-height: 100vh;
background: #fafafa;
color: #1a1a1a;
display: flex;
justify-content: center;
padding: 4rem 1.5rem 6rem;
}

.article {
width: min(720px, 100%);
display: flex;
flex-direction: column;
gap: clamp(3rem, 5vw, 4rem);
}

.section {
display: flex;
flex-direction: column;
gap: 1.25rem;
}

.breadcrumb {
display: inline-flex;
align-self: flex-start;
color: #4b5563;
font-size: 0.9rem;
text-decoration: none;
}

.breadcrumb:hover {
color: #3b82f6;
}

.eyebrow {
margin: 0;
color: #6b7280;
font-family:
"SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono",
"Courier New", monospace;
font-size: 0.75rem;
letter-spacing: 0.12em;
text-transform: uppercase;
}

.headline {
margin: 0.5rem 0 0;
color: #1a1a1a;
font-size: 2.25rem;
line-height: 1.2;
font-weight: 700;
}

.sectionHeading {
margin: 0;
color: #1a1a1a;
font-size: 1.5rem;
font-weight: 700;
}

.paragraph {
margin: 0;
color: #4b5563;
font-size: 1.05rem;
line-height: 1.7;
}

.externalLink {
color: #2563eb;
text-decoration: underline;
text-underline-offset: 2px;
}

.externalLink:hover {
color: #1d4ed8;
}

.ctaRow {
margin-top: 0.25rem;
}

.cta {
display: inline-block;
background: #3b82f6;
color: #ffffff;
border: none;
border-radius: 8px;
padding: 0.85rem 2.25rem;
font-size: 1rem;
font-weight: 600;
text-decoration: none;
box-shadow: 0 8px 24px -8px rgba(59, 130, 246, 0.45);
transition:
background 0.15s ease,
transform 0.15s ease;
}

.cta:hover {
background: #2563eb;
transform: translateY(-1px);
}

@media (max-width: 768px) {
.page {
padding: 2.5rem 1.25rem 4rem;
}

.article {
gap: clamp(2.25rem, 8vw, 3rem);
}

.headline {
font-size: 1.75rem;
}
}
128 changes: 128 additions & 0 deletions src/pages/About.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,128 @@
import { Link } from "react-router-dom";
import { Head } from "vite-react-ssg";
import styles from "./About.module.css";

export default function About() {
return (
<>
<Head>
<title>About CADViewer</title>
<meta
name="description"
content="Why CADViewer exists, how it works, and who's building it."
/>
<link rel="canonical" href="https://cadviewer.xyz/about" />
<meta property="og:title" content="About CADViewer" />
<meta
property="og:description"
content="Why CADViewer exists, how it works, and who's building it."
/>
<meta property="og:url" content="https://cadviewer.xyz/about" />
<meta property="og:type" content="website" />
<meta name="twitter:title" content="About CADViewer" />
<meta
name="twitter:description"
content="Why CADViewer exists, how it works, and who's building it."
/>
<body className="about-page" />
</Head>
<main className={styles.page}>
<article className={styles.article}>
<section className={styles.section}>
<Link to="/" className={styles.breadcrumb}>
← Back to CAD Viewer
</Link>
<p className={styles.eyebrow}>About</p>
<h1 className={styles.headline}>About CADViewer</h1>
</section>

<section className={styles.section}>
<h2 className={styles.sectionHeading}>Why this exists</h2>
<p className={styles.paragraph}>
Viewing a CAD file usually means installing something —
SolidWorks, Fusion 360, or at minimum a dedicated viewer app.
If you just need to look at a STEP file someone sent you, or
turn a 3D model into a drawing you can hand to a machine shop,
that's a lot of friction for an occasional task.
</p>
<p className={styles.paragraph}>
CADViewer is built to remove that friction: open the file in a
browser tab, view it, measure it, and generate a real
engineering drawing from it — no install, no account, no cost.
</p>
</section>

<section className={styles.section}>
<h2 className={styles.sectionHeading}>How it works</h2>
<p className={styles.paragraph}>
The viewer runs on OpenCascade (OCCT), the open-source CAD
kernel, compiled to WebAssembly so it runs directly in your
browser. Your file is never uploaded to a server — everything
from geometry parsing to drawing generation happens on your
own machine.
</p>
<p className={styles.paragraph}>
The 2D drawing generator specifically follows standard
drafting convention — third-angle projection, proper
dimension placement, correct scale selection — rather than
just capturing a picture of the model from three angles.
Getting that right took real iteration; a drawing that looks
plausible but is missing a dimension or duplicates one isn't
actually useful to whoever has to build the part from it.
</p>
</section>

<section className={styles.section}>
<h2 className={styles.sectionHeading}>Who's building this</h2>
<p className={styles.paragraph}>
CADViewer is built and maintained by Devaraj, working solo.
The project started from a simple frustration: needing to
open and document CAD files without paying for a SolidWorks
or Fusion 360 seat.
</p>
<p className={styles.paragraph}>
Most of the implementation has been built through iterative,
AI-assisted development — but every drafting decision, every
dimensioning rule, and every generated drawing has been
checked by hand against real drafting standards and tested on
real parts before shipping. The goal was never just "does it
run," it was "would this hold up if someone actually built
the part from it."
</p>
</section>

<section className={styles.section}>
<h2 className={styles.sectionHeading}>What's next</h2>
<p className={styles.paragraph}>
Sheet-metal unfold and flattening, exploded assembly views,
and BOM tables are next on the list. And more unexpected
features to come.
</p>
</section>

<section className={styles.section}>
<h2 className={styles.sectionHeading}>Get in touch</h2>
<p className={styles.paragraph}>
Found a bug, or need a format that isn't supported yet?{" "}
<a
href="mailto:devarajhello@gmail.com"
className={styles.externalLink}
>
Get in touch
</a>
.
</p>
</section>

<section className={styles.section}>
<div className={styles.ctaRow}>
<a className={styles.cta} href="/viewer">
Try CADViewer now
</a>
</div>
</section>
</article>
</main>
</>
);
}
Loading
Loading