Керівництво по стилю
Client-First - це набір керівних принципів та стратегій, створених Finsweet, щоб допомогти вам створювати веб-сайти Webflow.
Структурні класи
Визначена та гнучка структура ядра, яку ми можемо використовувати на всіх або більшості сторінок.
Рубрики
Теги HTML визначають стилі заголовків за замовчуванням. Використовуйте класи Heading, якщо стиль типографії не відповідає типовому тегу HTML.
Зразок тексту допомагає зрозуміти, як може виглядати реальний текст. Зразок тексту використовується як заповнювач.
Зразок тексту допомагає зрозуміти, як може виглядати реальний текст. Зразок тексту використовується як заповнювач.
Зразок тексту використовується як заповнювач. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст.
Зразок тексту використовується як заповнювач. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст.
Зразок тексту допомагає зрозуміти, як може виглядати реальний текст на вашому веб-сайті. Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній.
Зразок тексту допомагає зрозуміти, як може виглядати реальний текст на вашому веб-сайті. Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній.
Зразок тексту використовується як заповнювач. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст. Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній.
Зразок тексту використовується як заповнювач. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст. Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній.
Зразок тексту використовується як заповнювач. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст. Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст.
Зразок тексту використовується як заповнювач. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст. Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст.
Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст. Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст.
Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст. Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст.
Текстові класи
Класи тексту, коли стиль типографії не відповідає типовому тегу HTML.
Розміри тексту
Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній.
Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній на вашому веб-сайті.
Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст на вашому веб-сайті.
Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній на вашому веб-сайті. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст на вашому веб-сайті.
Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній на вашому веб-сайті. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст на вашому веб-сайті.
Стилі тексту
текст-стиль-закреслення
текст-стиль-курсив
текст-стилі-приглушений
текстовий стиль-allcaps
текст-стиль-новреп
текст-стиль-посилання
Зразок тексту використовується як заповнювач.
Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст на вашому веб-сайті. Зразок тексту використовується як заповнювач для реального тексту текстово-стиль-2lines
Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст на вашому веб-сайті. Зразок тексту використовується як заповнювач для реального тексту. Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст на вашому веб-сайті. Зразок тексту використовується як заповнювач для реального тексту.
Вага тексту
Вирівнювання тексту
Кольори
Керуйте повторюваними кольорами тексту та фону.
Кольори тексту
Кольори фону
Максимальна ширина
Використовуйте властивість CSS max-width, щоб містити внутрішній вміст до максимальної ширини.
Вкладиші
Утилітна система інтервалів - класи підкладки. [напрямок веслування] + [розмір підкладки].
Класи напряму
Класи розмірів
Поля
Утилітна система інтервалів - класи підкладки. [напрямок поля] + [розмір поля].
Класи напряму
Класи розмірів
Розпірки
Уніфікована розпірна система для проекту.
Іконки
Об'єднати розміри піктограм. висота піктограми встановлює висоту значків. піктограма-1x1 встановлює як висоту, так і ширину значків.
Корисні комунальні системи
Класи утиліти, які ми любимо використовувати в більшості наших проектів, щоб швидше будувати.
Елементи веб-потоку
Власні елементи Webflow із застосованими класами Client-First.
Приклад компонента форми за допомогою тек
Рубрика 1
Рубрика 2
Рубрика 3
Рубрика 4
Рубрика 5
Рубрика 6
Зразок тексту з посилання використовується як заповнювач для реального тексту, який зазвичай присутній. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст на вашому веб-сайті. Зразок тексту використовується як заповнювач для реального тексту. Зразок тексту використовується як заповнювач для реального тексту. Зразок тексту використовується як заповнювач для реального тексту.
- Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній.
- Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній.
- Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній.
- Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній.
- Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній.
- Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній.
Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній. Зразок тексту допомагає зрозуміти, як може виглядати реальний текст на вашому веб-сайті. Зразок тексту використовується як заповнювач для реального тексту, який зазвичай присутній.
