Go to https://claude.ai/chat/new (or any other chat you had in the past).
Then run this code:
function printClaude() { // (C) 2024 by ZeroWw. If you use this code, just give me some credit.
const centralPart = document.getElementsByClassName('mb-1 mt-1')[1].parentElement.parentElement.parentElement.parentElement;
if (centralPart) {
// Create a new window for printing
const printWindow = window.open('', '_blank', `width=${window.screen.width * 0.85},height=${window.screen.height * 0.85},left=${window.screen.width * 0.075},top=${window.screen.height * 0.045}`);
// Get the stylesheets of the current page
const styles = Array.from(document.styleSheets).map(styleSheet=>{
try {
return Array.from(styleSheet.cssRules).map(rule=>rule.cssText).join('\n');
} catch (e) {
console.error('Error occurred while getting stylesheet rules', e);
return '';
}
}
).join('\n');
ss = `:root {
--text-000: 49 6.9% 5.5%;
--text-100: 49 19.6% 13.3%;
--text-200: 49 18.8% 20%;
--text-300: 49 9% 30%;
--text-400: 49 7% 37%;
--text-500: 51 7.5% 42.1%;
--accent-main-000: 15 52.7% 43.9%;
--accent-main-100: 16 53.8% 47.5%;
--accent-main-200: 15 55.6% 52.4%;
--accent-secondary-000: 210 74.2% 42.1%;
--accent-secondary-100: 210 74.8% 49.8%;
--accent-secondary-200: 210 74.8% 57%;
--accent-secondary-900: 210 68.8% 93.3%;
--accent-pro-000: 251 34.2% 33.3%;
--accent-pro-100: 251 40% 45.1%;
--accent-pro-200: 251 61% 72.2%;
--accent-pro-900: 253 33.3% 91.8%;
--oncolor-100: 0 0% 100%;
--bg-000: 60 6.7% 97.1%;
--bg-100: 50 23.1% 94.9%;
--bg-200: 49 26.8% 92%;
--bg-300: 49 25.8% 87.8%;
--bg-400: 46 28.3% 82%;
--bg-500: 47 27% 71%;
--accent-main-900: 15 48% 90.2%;
--border-100: 48 12.5% 39.2%;
--border-200: 48 12.5% 39.2%;
--border-300: 48 12.5% 39.2%;
--oncolor-200: 60 6.7% 97.1%;
--oncolor-300: 60 6.7% 97.1%;
--border-400: 48 12.5% 39.2%;
--danger-000: 5 74% 28%;
--danger-100: 5 73.9% 37.7%;
--danger-200: 5 49.5% 58%;
--danger-900: 0 40.3% 89%
--white: 0 0% 100%;
--black: 0 0% 0%;
--kraft: 25 49.7% 66.5%;
--book-cloth: 15 52.3% 58%;
--manilla: 40 54% 82.9%
}`;
printWindow.document.write('<html><head><title>Claude_' + new Date().getTime() + '</title>');
printWindow.document.write('<style>' + ss + styles + '</style>');
printWindow.document.write('</head><body>');
printWindow.document.write(centralPart.innerHTML);
printWindow.document.write('</body></html>');
// remove disclaimer
elem = printWindow.document.getElementsByTagName('a')[0]
elem.parentElement.removeChild(elem)
// remove reply to claude
elem = printWindow.document.getElementsByClassName('border-0.5 border-border-300 flex')
elem2 = elem[elem.length - 1];
elem2.parentElement.removeChild(elem2)
// remove copy/paste elements
var elem = Array.from(printWindow.document.getElementsByClassName('absolute -bottom-0 -right-1.5 sm:right-2'));
elem.forEach((elem)=>elem.parentElement.removeChild(elem));
var elem2 = Array.from(printWindow.document.getElementsByClassName('absolute -bottom-0 left-[2.3rem]'));
elem2.forEach((elem2)=>elem2.parentElement.removeChild(elem2));
elem2 = Array.from(printWindow.document.getElementsByClassName('sticky bottom-0 mx-auto w-full pt-6'));
elem2.forEach((elem2)=>elem2.parentElement.removeChild(elem2));
setTimeout(printWindow.print.bind(printWindow), 3000);
} else {
console.error('Central part not found!');
}
}
printClaude();You can also add it as a bookmarklet in your browser:
javascript:(function(){var a=document.getElementsByClassName("mb-1 mt-1")[1].parentElement.parentElement.parentElement.parentElement;if(a){const b=window.open("","_blank",`width=${.85*window.screen.width},height=${.85*window.screen.height},left=${.075*window.screen.width},top=${.045*window.screen.height}`),e=Array.from(document.styleSheets).map(c=>{try{return Array.from(c.cssRules).map(d=>d.cssText).join("\n")}catch(d){return console.error("Error occurred while getting stylesheet rules",d),""}}).join("\n");b.document.write("<html><head><title>Claude_"+(new Date).getTime()+"</title>");b.document.write("<style>:root {\n --text-000: 49 6.9% 5.5%;\n --text-100: 49 19.6% 13.3%;\n --text-200: 49 18.8% 20%;\n --text-300: 49 9% 30%;\n --text-400: 49 7% 37%;\n --text-500: 51 7.5% 42.1%;\n --accent-main-000: 15 52.7% 43.9%;\n --accent-main-100: 16 53.8% 47.5%;\n --accent-main-200: 15 55.6% 52.4%;\n --accent-secondary-000: 210 74.2% 42.1%;\n --accent-secondary-100: 210 74.8% 49.8%;\n --accent-secondary-200: 210 74.8% 57%;\n --accent-secondary-900: 210 68.8% 93.3%;\n --accent-pro-000: 251 34.2% 33.3%;\n --accent-pro-100: 251 40% 45.1%;\n --accent-pro-200: 251 61% 72.2%;\n --accent-pro-900: 253 33.3% 91.8%;\n --oncolor-100: 0 0% 100%;\n --bg-000: 60 6.7% 97.1%;\n --bg-100: 50 23.1% 94.9%;\n --bg-200: 49 26.8% 92%;\n --bg-300: 49 25.8% 87.8%;\n --bg-400: 46 28.3% 82%;\n --bg-500: 47 27% 71%;\n --accent-main-900: 15 48% 90.2%;\n --border-100: 48 12.5% 39.2%;\n --border-200: 48 12.5% 39.2%;\n --border-300: 48 12.5% 39.2%;\n --oncolor-200: 60 6.7% 97.1%;\n --oncolor-300: 60 6.7% 97.1%;\n --border-400: 48 12.5% 39.2%;\n --danger-000: 5 74% 28%;\n --danger-100: 5 73.9% 37.7%;\n --danger-200: 5 49.5% 58%;\n --danger-900: 0 40.3% 89%\n --white: 0 0% 100%;\n --black: 0 0% 0%;\n --kraft: 25 49.7% 66.5%;\n --book-cloth: 15 52.3% 58%;\n --manilla: 40 54% 82.9%\n }"+e+"</style>");b.document.write("</head><body>");b.document.write(a.innerHTML);b.document.write("</body></html>");a=b.document.getElementsByTagName("a")[0];a.parentElement.removeChild(a);a=b.document.getElementsByClassName("border-0.5 border-border-300 flex");a=a[a.length-1];a.parentElement.removeChild(a);a=Array.from(b.document.getElementsByClassName("absolute -bottom-0 -right-1.5 sm:right-2"));a.forEach(c=>c.parentElement.removeChild(c));a=Array.from(b.document.getElementsByClassName("absolute -bottom-0 left-[2.3rem]"));a.forEach(c=>c.parentElement.removeChild(c));a=Array.from(b.document.getElementsByClassName("sticky bottom-0 mx-auto w-full pt-6"));a.forEach(c=>c.parentElement.removeChild(c));setTimeout(b.print.bind(b),3E3)}else console.error("Central part not found!")})();
For the less technical folks who come here in search of a solution to saving a Claude chat:
The JavaScript function above can be pasted into the URL of a bookmark to create a "bookmarklet", a mini app, applet, in the bookmark. That's a really cool way of customizing your browser without adding an extension.
BUT the browser need to be told how to interpret that pasted text by telling it what protocol to use. Most of the time, browsers use the "http:" or "https:" protocol, and if you are opening a local file instead of a remote one, it uses the "file:" protocol.
When you create your new bookmark, in the New Bookmark dialog, give it a name and when you get to the URL or Location field, first preceed the above JavaScript function with the protocol identifier, "javascript:". That's the only "modification" to the above code that you need, just tell the browser what it is. I've tested this in Chrome, Brave, and Firefox. That's it. Just tell the browsere that this is JavaScript and not the name of a local file or an HTTP URL, and paste in the above code.
Some people recommend first running the above code through a minify utility to make it smaller (removing extra spaces etc. that help human readability) but that isn't necessary; this is a relatively small applet.
I hope this helps.