Перейти до вмісту

Форма входу з розділеним екраном

Автентифікація · Вихідник Pro

Екран входу на всю висоту, побудований як одна обведена картка, розділена навпіл. Ліва половина починається кнопками провайдерів, під ними розділювач OR, а нижче — email, пароль і рядок «запам'ятати мене», виходячи з припущення, що більшість людей обирають шлях в один клік. Права половина — це панель із зображенням на весь екран, яка з'являється лише від точки перелому md і вище, тож на телефоні нічого не обрізається. Логіка авторизації не постачається — форма навмисно лишається непідключеною.

Відкрити живий прев'юОтримати Neobrutalism Pro
Автентифікація
Neobrutalist split screen sign in page for React and Tailwind CSS: on the left a SIGN IN heading, Google and GitHub buttons, an OR rule, email and password fields with an eye toggle, a Remember me checkbox and a Sign In button; on the right a full height panel of symmetrical flat artwork with a black pupil inside a yellow starburst eye.
Форма входу з розділеним екраном
  • Hero, ціни та auth
  • Перегляд кожної точки зупину
  • Скопіювати вихідний код
  • MCP готовий до встановлення
  • Radix · Base UI · React Aria
  • 158 готові блоки
  • Розділи сторінки, що відправляються
  • Інформаційні панелі та маркетинг
  • Pro розблоковує код
  • Компоновки з можливістю вільного розміщення
ПереглядБезплатноВідкрийте на весь екран і перемикайте брейкпоїнт або тему.КодProОдин самостійний файл TSX. Скопіюйте, володійте.ВстановленняProОдна команда CLI shadcn — або підказка для агента в Claude Code, Cursor чи будь-якому MCP-клієнті.

Зроблено з

Плюс lucide-react іконки й Tailwind CSS — жодних інших залежностей.

Ще Автентифікація макетів (6)

Показати все

https://neobrutalism.com/uk/blocks/authentication/split-screen-sign-in-form

Люблять розробники, дизайнери
і креатори

  • Натрапив на ваш UI-кіт і одразу забрав. Новий, активно підтримується і постійно вдосконалюється — чудова робота! 🤘

    Ziv Reich, Розробник ПЗ

  • Просто хочу сказати: neobrutalism.com — чудова робота. Справді подобається. З дизайном у мене біда, тож це просто порятунок. Поставив на свій особистий сайт.

    Paul Bratslavsky, Автор каналу Coding With Paul

  • Нарешті перезібрав свій особистий сайт на Neobrutalism.com — весела бібліотека, дуже легко почати!

    Cameron Blackwood, Контент-креатор

  • Neobrutalism.com — одна з моїх улюблених бібліотек UI-компонентів у ретростилі: компоненти, які справді можна ship’ити.

    Zhengyang Hou, Індіхакер

  • одна з моїх улюблених ui-бібліотек для вебу. класна робота, Аріф. сподіваюся, у проєкту все складеться на велике.

    Taseen Tanvir, Засновник і дизайнер

  • Спробував Neobrutalism.com Pro — UI-кіт, який не схожий на все інше. Необруталістичні блоки 🔥 прискорили прототипи дивних макетів.

    Nitesh Padghan, Гострайтер

  • Чудовий дизайн лендингу з ідеальним балансом і ритмом. Кольорова палітра разом з анімаціями створює винятковий користувацький досвід.

    Alan Obeng-Peprah, Senior Designer @ NativeXAI

  • Я справді вражений дизайном, який вони здали. Фінальний продукт точно збігся з тим, що я уявляв.

    Desmond, Співзасновник @ VectorlabsVentures

  • Як власник агенції я зазвичай витрачаю тижні на доведення макетів лендингів для клієнтів. З Neobrutalism.com я підключаю шаблон, правля copy — і готовий до релізу.

    Duke Opoku Amankwah, Засновник @ Midas

  • Шаблони не лише візуально сильні, а й надзвичайно добре структуровані. Заощадили нам тижні розробки.

    Abiola Braimah, Розробник @ Studio IX

  • Виняткова якість і увага до деталей. Адаптивний дизайн бездоганно працює на всіх пристроях.

    Acromond X., Співзасновник @ VectorlabsVentures

  • Інтеграція цих шаблонів у наш workflow помітно скоротила цикл розробки. Відмінна робота.

    Raquib S., Backend-розробник

  • Ці шаблони стали нашим основним ресурсом. Код чистий, добре задокументований і легко кастомізується.

    Hallic M., Розробник @ AtlasLabs

  • Шаблони Neobrutalism.com знаходять ідеальний баланс між естетикою та функціональністю. Справжній game-changer для наших проєктів.

    Ibrahim S., Frontend Lead @ ScaleUp

  • Відмінна підтримка і шаблони преміум-якості. ROI цих шаблонів феноменальний.

    Kevin K., CEO @ WebCraft

  • Шаблони Neobrutalism.com повністю змінили наш підхід до клієнтських проєктів. Якість коду виняткова, а дизайни — справді world-class.

    Danny G., Засновник DevStack

  • Я користувався багатьма бібліотеками шаблонів, але Neobrutalism.com вирізняється увагою до оптимізації продуктивності й чистої архітектури коду.

    Ian D., CTO у Wavelength

  • Анімації та мікроінтеракції в цих шаблонах абсолютно приголомшливі. Найкраща інвестиція для нашої design-команди.

    Ben S., Lead Designer у PixelPerfect

  • Як нетехнічний засновник, шаблони Neobrutalism.com допомогли нам запустити MVP в рекордні терміни без компромісів щодо якості дизайну. Наші інвестори були в захваті.

    Matthew I., Засновник стартапу

  • Мені подобається, наскільки модульні й добре задокументовані ці компоненти. Ми без тертя змішуємо частини з різних шаблонів.

    Garrett P., Frontend Lead у TechFusion

  • ROI шаблонів Neobrutalism.com неймовірний. Ми різко скоротили час розробки й при цьому віддаємо клієнтам сайти вищої якості.

    Xavier C., Власник агенції

Часто задавані
запитання

Як зібрано блок Форма входу з розділеним екраном, що ви можете змінити й коли його використовувати замість інших макетів.

Проблема з доступом до блоку? Надішліть електронного листа[email protected]
Get Pro — Save 33%--:--:--