Link-in-Bio Page with a Dark Theme in One HTML File
Creates your own link-in-bio page: a profile photo placeholder, titled links, social icons and a clean dark theme, mobile-first, as one HTML file you can host anywhere for free.
More in Web Design
3-Step "How It Works" Section for a Service WebsiteNewWeb DesignDesigns a 3-step "how it works" section for a service website: a number and icon idea per step, a headline under 6 words, a 2-sentence explanation and a flow where each step builds anticipation, so the process feels easy and trustworthy to first-time visitors.
Role: you are a UX content expert. Context: I am building a website for [service] and need to explain how it works. Task: design a complete process section in 3 steps. For each step, include: - the step number and a direction for its icon - a headline of fewer than 6 words - an explanation in 2 sentences Also show how each step creates anticipation for the next one, so that a first-time visitor sees the whole process as effortless and trustworthy.
Dark Mode Fitness Tracker App Screen with Progress RingsNewWeb DesignCreates the interface of a fitness tracking mobile app in dark mode, with a layout built on cards, progress rings and an orange accent color.
Create the user interface of a mobile app that tracks fitness. - Theme: dark mode - Layout: based on cards - Key element: progress rings - Accent color: orange
Fill-In Design Brief for a Rendered Claude ArtifactNewWeb DesignA fill-in brief that gets Claude to design and render a page, component, graphic or diagram: say what it is, who it is for, the visual style, the key elements and your colors and fonts, plus the output format if you know it.
Design [what it is, e.g., a landing page, a mobile app screen, an infographic] for [who it is for]. Visual style: [visual style, e.g., modern and minimal] Key elements: [the sections or components it must include] Colors and fonts: [hex colors and font names, if you have them] Format: [HTML for pages and layouts / React for interactive elements and dashboards with charts / SVG or Mermaid for graphics and diagrams — or leave it to you to choose]
Full Website Kit in 10 Phases: Pages, Copy, SEO, Legal and Audit10 phasesNewWeb DesignBuilds every part of a small business website in ten phases: landing page, homepage copy, about page, service tiers, an SEO article, contact page, case study, privacy and terms, a 404 page and a final audit of all the copy.
- Phase 1 — Landing page in HTML + CSS
Product: [product] Task: build a complete landing page for this product with these parts: - hero section - features - pricing - FAQ - a CTA button Style: clean and modern, and it must work well on mobile. Output: the full HTML + CSS.
- Phase 2 — Homepage copy
Target audience: [niche] Task: write all the text for the homepage of my website, covering: - headline - subheadline - section on the benefits - a placeholder for social proof - a CTA in the footer
- Phase 3 — About page
My business: [business type] Task: write a complete About page for it, with: - the story of the brand - mission - values - a placeholder for the team section - trust badges It should feel human and believable.
- Phase 4 — Services page with 3 tiers
My business: [agency/freelance business] Task: build a page presenting my services as 3 tiers. For every tier give: - a name - a description - what it includes - a "Book a Call" CTA
- Phase 5 — SEO article with outline
Target keyword: [keyword] Task: write first an outline, then the complete SEO article of 1,500 words for this keyword. Include: - meta title - meta description - H2 headings - placeholders for internal links
- Phase 6 — Contact page in HTML
Task: create a contact page that includes: - the layout of a contact form - a statement that builds trust - a note on how quickly I reply - an FAQ section answering the usual objections Output: HTML.
- Phase 7 — Portfolio or case study page
Project: [project] Task: build a portfolio or case study page about this project, covering: - the problem - the solution - the results - the tools used - a placeholder for a testimonial Make it easy to skim.
- Phase 8 — Privacy policy and terms of service
Type of website: [type of website] Task: write a complete privacy policy and complete terms of service for my website. Use plain English, with the structure of a legal document. At the end, add one line reminding me to have both documents checked by a legal professional.
- Phase 9 — 404 error page
Task: create a 404 error page with: - copy that matches my brand - a CTA that sends visitors elsewhere on the site - a placeholder for a search bar Tone: friendly, never robotic.
- Phase 10 — Full copy audit
My website copy: [paste all of your website copy] Task: audit all of this copy in full: 1. what is weak 2. what is missing 3. what to fix Then rewrite the 3 areas with the biggest problems.
Mobile Website Fix: Layout, Tap Targets and Load SpeedNewWeb DesignFixes a website that looks poor on phones and is losing customers: layout changes that make the mobile version feel premium, button sizes that make tapping easy and loading-speed improvements that stop visitors leaving.
Role: you are a specialist in optimizing websites for mobile. Problem: my website looks bad on phones and it is costing me customers. Task: fix it completely, covering: 1. Layout: the changes that make the mobile version feel premium. 2. Buttons: the sizing that makes tapping effortless. 3. Speed: the loading improvements that keep visitors from leaving. If I haven't shared my site's URL, code or a description of the current layout, ask me for it first.