Skip to content
Recaply.
Sign inSubmit a tool

DirectorySkills

Private jet travel landing page: 1440, made in this run
Run 1Private jet travel landing page“Landing page for our yacht charter company. Brief in brief.md.”
Runs in
  • Claude Code
  • Codex
  • Cursor
  • Gemini CLI
  • GitHub Copilot
  • OpenCode
Generates with
Your agent's model
Tested with
Claude Code 2.1.322Claude Sonnet 5.51 real run, 10 Nov
Needs
Node 20+Chrome
Licence
Recaply licence

Private Jet Travel Landing Page

A sky-and-cloud private jet landing page: jet over clouds, fleet, empty-leg flights, figures, quotes and enquiry.

$9.99once, yours to keep

Every premium skill and prompt, one plan$19.99 a month. Cancel any time. What you get when you buy

Payments are non-refundable. See our Terms of service.

Builds a private jet or premium travel landing page above the clouds into your own project: soft sky blue to cream with drifting clouds and a jet, navy and champagne gold, a light elegant serif, the fleet as cards, empty-leg flights as a list, figures, quotes, questions and an enquiry form. Plain HTML, CSS and JavaScript, or matched to React, Next.js, Vue, Svelte, Astro or Tailwind when the project uses them. Comes with a working reference and a check that screenshots it at phone, tablet and desktop widths and flags sideways overflow, text under 12px, missing alt text and names, low contrast, no focus styles, motion that ignores reduced motion, leftover sample words and emoji icons. Use when a private aviation, charter, luxury travel or concierge service needs a landing page, or someone asks for a calm, sky-and-cloud, luxury look.

By RecaplyUpdated 12 Nov

Install Private Jet Travel Landing Page

After the download, ask your agent to add it, or run the line yourself.

Read https://recaply.co/skills/private-jet-travel-landing-page/install.md and follow it to install the private-jet-travel-landing-page skill from private-jet-travel-landing-page.zip.

Paste it into your agent. It reads our install steps, finds the ZIP you downloaded and adds the skill for you.

New to skills? How to install a skill

Similar skills

All 735 skills

Who Private Jet Travel Landing Page is for

What you get

  • One HTML file with its CSS inside: no build step, no framework
  • A private jet or premium travel landing page above the clouds
  • Checked at phone and desktop widths

Good fit

  • When a private aviation, charter, luxury travel or concierge service needs a landing page

Not for

  • An app with a backend, sign-in or a database
  • Copying another company's site

About this skill

You say

Landing page for our yacht charter company. Brief in brief.md.

It said back

The landing page is built and the automated check passes at 390, 768 and 1440px. It covers overflow, small text, alt text, names, contrast, focus styles, reduced motion and script errors. I also looked at the 390 and 1440 screenshots. I didn't open the 768 one, and I haven't tried the phone menu or the form by hand.

Files (in work1/): index.html, style.css, script.js, plus the screenshots in check/ (390.png, 768.png, 1440.png).

Show more

What it did in run 1

  1. ./brief.md
  2. ls -la .
  3. private-jet-travel-landing-page
  4. cd ./.claude/skills/private-jet-travel-landing-page; ls -R reference | head -30; wc -l reference/*; cat reference/index.html
  5. ./.claude/skills/private-jet-travel-landing-page/reference/style.css
  6. ./.claude/skills/private-jet-travel-landing-page/reference/script.js
  7. cd . && S=.claude/skills/private-jet-travel-landing-page/reference && cp $S/style.css style.css && cp $S/script.js script.js && python3 - <<'EOF' import re css=open('style.css').read() css=css.replace("#BFD6EA 0%,#DCE7F0 45%,#F7F4EE 100%","#B9D4E3 0%,#D8E6EC 45%,#F7F4EE 100%") css=css.replace(".jet-fly",".boat-fly").replace("@keyframes rise{to{transform:translateY(-12px) rotate(-1.5deg)}}","@keyframes rise{to{transform:translateY(-8px) rotate(-1deg)}}") css+=""" .feat-list{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))} .feat-meta{margin-top:1rem;font-weight:500;color:var(--em)} .note{font-size:.9rem;color:var(--muted);margin-top:1.5rem} .sched-time{white-space:nowrap} .sched-time s{font-family:var(--font-body);font-size:.95rem;color:var(--muted);margin-right:.5rem} .sched .tag{position:static} .ph{background:#F1E7D2;padding:0 .3em;border-radius:2px} .field-row{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center} @media (prefers-reduced-motion:reduce){.clouds i,.boat-fly{animation:none!important}} """ open('style.css','w').write(css) js=open('script.js').read() js=js.split("\n// Billing switch")[0]+""" // Quote form: no server yet, so say so. Connect to your own handler. for (const f of document.querySelectorAll('[data-form]')) f.addEventListener('submit', (e) => { e.preventDefault(); const s = f.querySelector('.form-status'); if (s) s.textContent = f.dataset.done || 'Thank you. We will be in touch with your quote.'; }); """ open('script.js','w').write(js) def sail(fill): return f'<svg viewBox="0 0 340 160" aria-hidden="true" focusable="false"><path d="M168 12v100" stroke="#12223D" stroke-width="3"/><path d="M172 16c30 24 48 54 54 90h-54z" fill="#fff" stroke="#12223D" stroke-width="3"/><path d="M164 28c-20 22-34 48-40 78h40z" fill="{fill}" stroke="#12223D" stroke-width="3"/><path d="M60 112h220l-24 24H88z" fill="#12223D"/><path d="M66 118h208" stroke="#B8924A" stroke-width="3"/><path d="M10 144q20-8 40 0t40 0 40 0 40 0 40 0 40 0 40 0" stroke="#7FA6C0" stroke-width="3" fill="none"/></svg>' def motor(fill): return f'<svg viewBox="0 0 340 160" aria-hidden="true" focusable="false"><path d="M100 80h110l30 30H84z" fill="{fill}" stroke="#12223D" stroke-width="3"/><path d="M118 60h74l16 20H110z" fill="#fff" stroke="#12223D" stroke-width="3"/><path d="M130 66h50" stroke="#12223D" stroke-width="3"/><path d="M40 110h260l-26 28H72z" fill="#12223D"/><path d="M50 117h238" stroke="#B8924A" stroke-width="3"/><path d="M10 146q20-8 40 0t40 0 40 0 40 0 40 0 40 0 40 0" stroke="#7FA6C0" stroke-width="3" fill="none"/></svg>' hero=sail('#F0EBE0').replace('aria-hidden="true" focusable="false"','role="img" aria-label="Sailing yacht on calm water"') chev='<svg class="ic" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M12 5v14M5 12h14"/></svg>' brand='<svg viewBox="0 0 32 32" aria-hidden="true" focusable="false"><path d="M16 3c6 8 10 13 10 18a10 10 0 0 1-20 0c0-5 4-10 10-18z" fill="#B8924A"/></svg><span>Bluewater Charters</span>' def faq(q,a,o=''): return f'<details class="reveal"{o}><summary>{q}{chev}</summary><p>{a}</p></details>' def leg(d,t,p,old): return f'<li class="sched reveal"><p class="sched-day"><span class="ph">[Dates TBC]</span></p><div class="sched-main"><h3>{t}</h3><p>7 days · crewed</p></div><p class="sched-time"><s>{old}</s>{p}</p><span class="tag">30% off</span></li>' html=f'''<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Bluewater Charters: Crewed yacht charters in Croatia and Greece</title> <meta name="description" content="Crewed yacht charters in Croatia and Greece. Seven days at sea, from €14,000 a week. Request a quote."> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Cormorant:ital,wght@0,500;0,600;1,500&family=Jost:wght@400;500&display=swap"> <link rel="stylesheet" href="style.css"> </head> <body> <a class="skip" href="#main">Skip to content</a> <header class="nav nav-bar"><div class="wrap nav-in"> <a class="brand" href="index.html" aria-label="Bluewater Charters home">{brand}</a> <button class="nav-toggle" type="button" data-nav-toggle aria-expanded="false" aria-controls="menu"><svg class="ic" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M4 7h16M4 12h16M4 17h16"/></svg><span class="sr-only">Menu</span></button> <nav id="menu" class="menu" aria-label="Main"><ul><li><a href="#yachts">Yachts</a></li><li><a href="#offers">October offers</a></li><li><a href="#faq">Questions</a></li></ul><a class="btn btn-primary btn-sm" href="#quote">Request a quote</a></nav> </div></header> <main id="main"> <section class="hero hero-center"><div class="wrap hero-in"><div class="hero-words reveal"><p class="kicker">Croatia · Greece</p><h1>Seven days at sea, <em>entirely looked after</em></h1><p class="hero-sub">Crewed yacht charters along the coasts of Croatia and Greece. Choose your yacht, and your crew takes care of the rest.</p><div class="hero-ctas"><a class="btn btn-primary" href="#quote">Request a quote<svg class="ic" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a><a class="btn btn-ghost" href="#offers">October offers</a></div><div class="clouds" aria-hidden="true"><i></i><i></i><i></i></div></div><div class="hero-art reveal"><div class="boat-fly">{hero}</div></div></div></section> <section class="sec features features-grid" id="yachts" aria-labelledby="yachts-h"><div class="wrap"><div class="sec-head"><h2 id="yachts-h">The <em>yachts</em></h2><p class="sec-sub">Every charter is a week, with a crew on board.</p></div><ul class="feat-list"> <li class="feat reveal"><div class="feat-art">{sail('#F0EBE0')}</div><h3>50ft sailing yacht</h3><p>Eight guests under sail along the Croatian and Greek coasts.</p><p class="feat-meta">From €14,000 per week</p></li> <li class="feat reveal"><div class="feat-art">{motor('#F0EBE0')}</div><h3>70ft motor yacht</h3><p>Ten guests, with room to spread out and a steady pace between islands.</p><p class="feat-meta">From €38,000 per week</p></li> <li class="feat reveal"><div class="feat-art"><svg viewBox="0 0 340 160" aria-hidden="true" focusable="false"><circle cx="170" cy="70" r="34" fill="none" stroke="#12223D" stroke-width="3"/><path d="M170 36v68M136 70h68M146 46l48 48M194 46l-48 48" stroke="#12223D" stroke-width="3"/><circle cx="170" cy="70" r="8" fill="#B8924A"/><path d="M10 144q20-8 40 0t40 0 40 0 40 0 40 0 40 0 40 0" stroke="#7FA6C0" stroke-width="3" fill="none"/></svg></div><h3>Fully crewed</h3><p>Every charter comes with a crew, so you can simply enjoy the week.</p></li> </ul></div></section> <section class="sec schedule" id="offers" aria-labelledby="offers-h"><div class="wrap"><div class="sec-head"><h2 id="offers-h">Last-minute <em>offers</em></h2><p class="sec-sub">Three weeks in October at 30% off.</p></div><ul class="sched-list"> {leg('','Week one in October','from €9,800','€14,000')} {leg('','Week two in October','from €9,800','€14,000')} {leg('','Week three in October','from €9,800','€14,000')} </ul><p class="note">Prices shown are the 50ft sailing yacht, from €14,000 less 30%. The 70ft motor yacht starts from €26,600 under the same offer. Which weeks are available is confirmed in your quote.</p></div></section> <section class="sec stats"><div class="wrap"><dl class="stat-list"><div class="stat reveal"><dt>at sea, every charter</dt><dd>7 days</dd></div><div class="stat reveal"><dt>Croatia and Greece</dt><dd>2 countries</dd></div><div class="stat reveal"><dt>from 8 to 10 guests on board</dt><dd>2 yachts</dd></div></dl></div></section> <section class="sec faq" id="faq" aria-labelledby="faq-h"><div class="wrap faq-in"><div class="sec-head"><h2 id="faq-h">Questions</h2></div><div class="faq-list"> <details class="reveal" open><summary>Where do you sail?{chev}</summary><p>Our crewed charters run in Croatia and Greece.</p></details> {faq('How long is a charter?','Charters are seven days.')} {faq('How many guests can come?','The 50ft sailing yacht takes eight guests. The 70ft motor yacht takes ten.')} {faq('What do the October offers include?','Three weeks in October are offered at 30% off. Ask us in your quote request which weeks are open.')} </div></div></section> <section class="sec cta cta-band" id="quote" aria-labelledby="quote-h"><div class="wrap"><div class="cta-box reveal"><h2 id="quote-h">Ready to set <em>sail</em>?</h2><p>Leave your email and we will send you a quote for your week.</p><form class="inline-form" data-form><label class="sr-only" for="quote-email">Email address</label><input id="quote-email" type="email" name="email" required placeholder="you@example.com" autocomplete="email"><button class="btn btn-primary" type="submit">Request a quote</button><p class="form-status" role="status" aria-live="polite"></p></form></div></div></section> </main> <footer class="foot"><div class="wrap foot-in"><div class="foot-brand"><a class="brand" href="index.html">{brand}</a><p>Crewed yacht charters in Croatia and Greece.</p></div><nav class="foot-col" aria-label="Charters"><h2>Charters</h2><ul><li><a href="#yachts">Yachts</a></li><li><a href="#offers">October offers</a></li><li><a href="#quote">Request a quote</a></li></ul></nav><nav class="foot-col" aria-label="Help"><h2>Help</h2><ul><li><a href="#faq">Questions</a></li><li><a href="#quote">Contact</a></li></ul></nav></div><div class="wrap foot-small"><p>© <span data-year>2026</span> Bluewater Charters.</p></div></footer> <script src="script.js" defer></script> </body> </html>''' open('index.html','w').write(html) EOF sed -i '' 's/.foot-in{display:grid;grid-template-columns:1.6fr repeat(3,1fr)/.foot-in{display:grid;grid-template-columns:1.6fr repeat(2,1fr)/' style.css node .claude/skills/private-jet-travel-landing-page/scripts/check.mjs index.html --out check 2>&1 | tail -30
  8. cd . && ls; (timeout 120 node .claude/skills/private-jet-travel-landing-page/scripts/check.mjs index.html --out check 2>&1 | tail -30)
  9. cd . && ls
  10. S=.claude/skills/private-jet-travel-landing-page/reference; cp $S/style.css style.css; cp $S/script.js script.js; head -n 17 script.js > s.tmp; mv s.tmp script.js; ls
  11. ./script.js
  12. ./style.css
  13. ./index.html
  14. node .claude/skills/private-jet-travel-landing-page/scripts/check.mjs index.html --out check
  15. ./check/1440.png
  16. ./check/390.png
  17. Done

10 Nov 2026 · Claude Code 2.1.322 with Claude Sonnet 5.5 · 2 min 6 s · $0.45 of API use

Questions

Is Private Jet Travel Landing Page free?

No. Private Jet Travel Landing Page costs $9.99 once and stays in your Recaply account, or it comes with the Recaply plan ($19.99 a month), which opens every premium skill and prompt.

Which agents can use Private Jet Travel Landing Page?

Claude Code, Codex, Cursor, Gemini CLI, GitHub Copilot and OpenCode.

What do I get when I buy Private Jet Travel Landing Page?

A ZIP of the whole skill folder (39 KB): the SKILL.md your agent follows and its 6 other files, the references, templates and scripts it uses. You download it from this page whenever you need it, and install it in Claude Code, Codex, Cursor, Gemini CLI, GitHub Copilot and OpenCode. The Recaply plan opens it too, with every other premium skill and prompt.

How do I install Private Jet Travel Landing Page?

Buy it, then download the ZIP from this page. For Claude Code, unzip it into .claude/skills/ in your project. For Codex, Cursor and Gemini CLI, unzip it and run npx skills add ./private-jet-travel-landing-page with your agent's flag.

What do I get from Private Jet Travel Landing Page?

One HTML file with its CSS inside: no build step, no framework. A private jet or premium travel landing page above the clouds. Checked at phone and desktop widths.

What does Private Jet Travel Landing Page need?

Node 20+ and Chrome, and no API key. Each use costs nothing beyond your agent.

How big is Private Jet Travel Landing Page?

7 files, about 28,976 tokens in all. The SKILL.md is about 2,576 tokens, and your agent reads it only when the job fits.

What does a run cost?

Our 1 runs took 2 min 6 s to 2 min 6 s and $0.45 to $0.45 of API use each, in Claude Code with claude-sonnet-5-5. On a Claude plan, a run counts toward your usage instead.

Do I have to name Private Jet Travel Landing Page to use it?

Type /private-jet-travel-landing-page first to make sure it loads. Without it, Claude Code may judge a small job simple enough to do without the skill.