`createContext`

Creates a context object that components can provide and read.

Since React 16.3 Spec ↗

Syntax

const Context = createContext(defaultValue)

Parameters

Name	Type	Required	Description
`defaultValue`	`any`	Yes	Value used when a consumer has no matching provider above it.

Returns

Context — A context object with a Provider and the legacy Consumer.

Examples

const ThemeContext = createContext('light');

function App() {
  return (
    <ThemeContext.Provider value="dark">
      <Toolbar />
    </ThemeContext.Provider>
  );
}

const theme = useContext(ThemeContext);

Notes

The default value is used only when no provider is found; it is not used when a provider passes undefined. In React 19 the context object itself can be rendered as a provider (`<ThemeContext value=...>`). Read it with useContext or the use hook.