3 个仓库
Accepts arrays as prop values to define styles across multiple breakpoints without media query boilerplate.
Distinct from Responsive Breakpoints: Distinct from Responsive Breakpoints: focuses on the array-based syntax for defining breakpoint values, not the general concept of responsive breakpoints.
Explore 3 awesome GitHub repositories matching user interface & experience · Responsive Array Syntax. Refine with filters or upvote what's useful.
Styled System is a JavaScript library that provides a style props approach for building UI components, enabling developers to map CSS properties directly to component props for rapid, declarative development. At its core, it resolves design tokens from a centralized theme object into CSS values, ensuring consistent styling across components without writing custom stylesheets. The library supports theme-aware styling that connects component styles to a theme object for scalable, maintainable design systems with dynamic value resolution. The library differentiates itself through several capabil
Ships a responsive array syntax that defines styles across breakpoints without media query boilerplate.
Theme-ui 是一个 React 主题框架和 CSS-in-JS 实用工具,用于构建可主题化的用户界面。它作为一个设计系统工具,建立了用于颜色、排版和间距的集中式、基于约束的比例,以确保跨应用程序的视觉一致性。 该框架的特色在于用于移动优先布局的基于数组的响应式简写,以及一个与浏览器偏好同步并持久化用户选择的专用颜色模式管理器。它还具有一个用于通过属性控制组件外观的命名样式变体系统,并提供将主题配置转换为 Figma 样式的同步功能。 该项目涵盖了一套广泛的样式功能,包括用于元素重置的全局 CSS 注入、通过上下文进行的嵌套主题覆盖,以及用于扩展设计预设的深度合并配置系统。它还包括一组可主题化的布局组件,例如响应式网格和标准化表单输入。 提供了一个专用的插件,用于将该设计系统集成到 Gatsby 站点中。
Provides an array-based syntax to define styles across multiple breakpoints without writing repetitive media query boilerplate.
Chakra Templates is a collection of prebuilt, responsive interface patterns designed for integration into React applications. It functions as a frontend design system resource, providing modular UI building blocks that allow developers to maintain consistent styling and layout standards across multiple application screens. The repository provides raw source code for every template, enabling direct integration and full customization within local project files. By utilizing a style-prop-driven approach, these components map design tokens to attributes, ensuring that layouts remain consistent wi
Uses array-based syntax to define responsive style adjustments across multiple screen breakpoints.