Svelte Use

useMediaQuery

Reactive Media Query. Once you've created a MediaQueryList object, you can check the result of the query or receive notifications when the result changes.

Usage 

<script>
  import { useMediaQuery } from '@svelte-core'

  const isLargeScreen = useMediaQuery('(min-width: 1024px)')
  const isPreferredDark = useMediaQuery('(prefers-color-scheme: dark)')
</script>

Type Declarations 

/**
 * Reactive Media Query
 *
 * @param query
 * @param options
 */
export declare function useMediaQuery(
  query: string,
  options?: ConfigurableWindow
): Readable<boolean>

Source

Source • Docs