Cursor
Затишна майстерня з пергаменту, освітлена тліючим вугіллям
Cursor використовує теплий, немов пергамент, стиль оформлення: кремове полотно, чорний як чорнило текст і єдиний акцент вогняно-жовтогарячого кольору, який активує посилання та виділення, а не заповнює кнопки. Заголовки, набрані шрифтом CursorGothic товщиною 400, мають міжбуквенну відстань, що поступово зменшується, у міру збільшення розміру - авторитетність досягається за рахунок стриманості і зменшення товщини букв, а не за рахунок жирного шрифту. Поверхні залишаються плоскими та схожими на папір, з тонкими рамками та м'якими теплими сірими тінями; кути залишаються чіткими при товщині 4px протягом усього тексту. Шрифт EB Garamond використовується вибірково для підзаголовків та прози, а berkeleyMono обробляє код, мітки та метадані, надаючи системі друкарської індивідуальності, яка більше нагадує літературний журнал, ніж панель управління SaaS.
Максимальна ширина 1300px по центру, 24px зовнішній відступ. Верхня навігація: 52px високий прозорий заголовок з логотипом та текстовим знаком зліва, 4 посилання навігації по центру, кластер «Вхід / Контакти / Завантажити» вирівняний праворуч. Герой: заголовок, вирівняний по лівому краю + подвійний блок закликів до дії з текстом, що йде зверху зліва, потім повнорозмірна картка-макет продукту, що займає всю ширину сторінки. Смуга довіри: один горизонтальний ряд із 8 плиток логотипу в одну лінію за шириною розділу. Розділи з функціями чергують текст зліва та скріншот праворуч у двоколоночному розташуванні, кожен 50/50, з вертикальним ритмом 64-96px між розділами. Усі скріншоти функцій є макети вікон з ідентичним оформленням macOS. Нижній колонтитул: чотириколонна сітка посилань з фірмовим знаком зліва. Розділи розділені великим простором для «дихання», а не роздільниками — кремове полотно по собі забезпечує поділ.
У центрі уваги – скріншоти продукту: великі макети вікон macOS, що демонструють роботу IDE Cursor: вкладки файлів, перегляд відмінностей, плани агентів, панелі терміналу, інтеграція зі Slack/чатом. Кожен макет вікна поміщений у рамку картки #f2f1ed із м'яким теплим контрастом. Приглушена фотографія пейзажу (гори/пустельний горизонт) виходить за межі головного розділу, додаючи теплоти, не конкуруючи з інтерфейсом користувача. Логотипи клієнтів ( Stripe, OpenAI, Linear, Datadog, NVIDIA, Figma, Ramp, Adobe) представлені у вигляді монохромних написів усередині плиток Linen у формі таблеток. Жодних фотографій людей, ілюстрацій, абстрактних декоративних графічних елементів — вся візуальна вага зосереджена на інтерфейсі продукту і фірмових знаках. Іконки є тонкі монолінійні гліфи, заповнені кольором #7a7974 Ash, ніколи не хроматичні.
Палітра
Нейтральні
- Ink
#26251e— Основний текст, фон основної кнопки дії, текст навігації – теплий, майже чорний відтінок, ніколи не чистий #000 - Parchment
#f7f7f4— Фон сторінки, основне полотно - теплий кремовий відтінок, який пом'якшує контраст і створює відчуття друку чорнилом, а не цифрового друку. - Bone
#f2f1ed— Картонні поверхні та підняті контейнери — на один тон темніші за полотно, створюють ефект багатошарової «папір на папері» без кордонів. - Linen
#e6e5e0— Світла нейтральна заливка для кнопок на темних поверхнях. - Stone
#cdcdc9— Тонкі межі, роздільники, ледь помітні перегородки - лінії 1px теплих відтінків - Mist
#a1a19f— Допоміжний текст третього рівня, підписи між приглушеним і другорядним текстом.
Друкарня
від 12 до 72px · 6 ступенів
- CursorGothic — заміна: Inter · зображення 400, 500 · Основний шрифт для інтерфейсу користувача, заголовків, навігації, основного тексту та оформлення товарів. Заголовки товщиною 400 з міжбуквенною відстанню, що поступово зменшується (-0.005em на 22px → -0.03em на 72px) — відмінна риса шрифту: заголовки ніколи не виділяються жирним шрифтом. Функції шрифту ss08, ss09, tnum активують стилістичні альтернативи та табличні цифри.
- EB Garamond — заміна: Iowan Old Style · зображення 400, 500 · Редакційний шрифт із засічками для окремих підзаголовків, основного тексту та табличних даних додає літературну виразність в інтерфейсі CursorGothic.
- berkeleyMono — заміна: ui-monospace · зображення 400, 500 · Monospace – для блоків коду, фрагментів командного рядка, метаданих, шляхів до файлів та міток для розробників – технічна мова.
Інтервали та форма
| Призначення | Значення |
|---|---|
| Щільність | щільна |
| Базовий крок | 8px |
| Радіус кнопок | 4px |
| Радіус карток | 4px |
| Тіні | ні — межі замість тіней |
| Між секціями | 64-96px |
| Ширина сторінки | 1300px |
ІІ збере ваш сайт у стилі Cursor і наповнить його
- Наповнить товарами та постами за посиланням - Instagram, TikTok, Facebook.
- Перенесе контент зі старого сайту – достатньо вказати адресу.
- Сучасний дизайн на кращому движку: React ( Next.js) з серверним рендерингом та SEO-оптимізацією з коробки.
- Повна автоматична SEO-оптимізація під пошукову видачу та рекомендації нейромереж.
Схожі стилі
- Amplemarket — Залите сонцем робоче місце, посипане конфетті
- Getharvest — Робочий стіл у «золоту годину» — полотно теплого кремового кольору, білі листівки, розвішані на полотні, та одне яскраве помаранчеве полум'я
- Drive Capital — Ретро-постер для подорожі на теплому папері
- Wealthsimple — Склад, оброблений кашеміром, з галерейним освітленням
- Huddle — Пастельні інвентарні картки на кремовому папері
- Fuser — Розкидані полароїдні знімки на робочій стіні дизайнера
- Campsite — Залите сонцем робоче місце редактора — папір теплого кремового кольору з одним помаранчевим відбитком наміру
- Redis Agency — Редакційна майстерня, що працює в неробочий час, - це непроглядна темрява, де всю роботу над брендом виконують шрифти з засічками і одна-єдина червона редиска
- AI Product Generation — Фотостудія для редакційної зйомки на білому папері - заголовок як обкладинка, помаранчевий колір - для виділення тексту редактором
- Getanchor — Теплий теракотовий відтінок на кремовому тлі, що вицвіло від сонця.
- Flatfile — Тихий щоденник даних на теплому пергаменті
- Inthememory — Архітектурне креслення на білому мармурі з єдиним теплим вогником. Тиха, редакційна кімната даних, де глибокі бірюзові чорнила та елементи управління у формі таблеток ширяють над білими поверхнями, що порушуються лише одним помаранчевим сплеском.