Top 14 media-query Open-Source Projects

• postcss-px-to-viewport

  1 2,945 0.0 JavaScript

  A plugin for PostCSS that generates viewport units (vw, vh, vmin, vmax) from pixel units. The best choice to create a scalable interface on different displays by one design size.

  

• @artsy/fresnel

  8 1,212 7.1 TypeScript

  An SSR compatible approach to CSS media query based responsive layouts for React.

  

• SurveyJS

  surveyjs.io featured

  Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  

• dark-mode-toggle

  2 1,157 4.9 JavaScript

  A custom element that allows you to easily put a Dark Mode 🌒 toggle or switch on your site:

  

• breakpoint-slicer

  2 345 0.0 SCSS

  Slice media queries with ease

• react-native-css-modules

  1 323 2.4

  Style React Native components using CSS, PostCSS, Sass, Less or Stylus.

• Slidy

  1 293 8.3 TypeScript

  📸 Sliding action script

• tailwindcss-theme-variants

  1 181 2.0 TypeScript

  Media-query- or JavaScript-based theme variants with fallback for Tailwind CSS

Project mention: The 7 best plugins to use in your Tailwind project | dev.to | 2023-10-11

Tailwind CSS Theme Variants is a plugin that allows you to define multiple themes for a single project and apply different themes in varying scenarios. It lets you choose which theme should be active based on the value of a media query (like prefers-color-scheme or prefers-contrast ), the presence of a CSS selector (like a class or data attribute), or some combination of both.

• InfluxDB

  www.influxdata.com featured

  Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

  

• Fluid-Size

  1 42 1.8 SCSS

  :triangular_ruler::iphone::computer::desktop_computer: A method of fluidly resizing in various devices based on visual angle. (with SASS) :revolving_hearts: :eyes:

• react-responsive

  1 22 5.0 TypeScript

  🔍 <Only /> displays some contents for particular screen sizes (by bloczjs)

  

• schemable-svelte

  2 7 10.0 TypeScript

  svelte action for class decoration derived from media queries or user preferences.

• reflexy

  0 6 8.0 TypeScript

  Flexbox layout and responsive components.

• react-native-media-query-hook

  1 4 10.0 TypeScript

  A simplified version of the media queries in css. Currently supports minWidth, maxWidth, minHeight, maxHeight, and orientation to detect landscape or portrait modus.

• coreCSS

  1 4 5.9 CSS

  Ready to use default style sheet that contains default styles, positioning, responsiveness, normalizing, and rapid whole site style changes via CSS variables, all by CDN import.

• picture-element

  1 2 10.0 CSS

  A tutorial for explaining how to use the html picture element

• SaaSHub

  www.saashub.com featured

  SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives

  

media-queries related posts

• Dark Mode toggle with Svelte

  2 projects | /r/sveltejs | 8 Oct 2022

• I’ve built two type-safe React hooks that will help you in making your apps more accessible

  1 project | /r/typescript | 20 Jan 2022

• What is the easiest way to merge webpages and make it responsive except media queries?

  2 projects | /r/web_design | 13 Jun 2021

• Making Next.js work with react-responsive

  1 project | /r/reactjs | 1 May 2021

Index

Sponsored

SaaSHub - Software Alternatives and Reviews

SaaSHub helps you find the best software and product alternatives

www.saashub.com