ESLint plugin

The essential plugin for use with the Atlassian Design System.

use-latest-xcss-syntax-typography

Description

Soon, applying fontSize, lineHeight, fontWeight with xcss will be deprecated. Please refrain from adding new usages, as you will need to remove them soon anyway. As an alternative, you can use the Text and Heading primitives.

Examples

Incorrect

const myStyles = xcss({
    fontSize: '14px',
    ^^^^^^^^^^^^^^^^
    lineHeight: '20px',
    ^^^^^^^^^^^^^^^^^^
    fontWeight: 500,
    ^^^^^^^^^^^^^^^
});

<Box as="p" xcss={myStyles}>
    ...
</Box>;

Correct

import { Text } from '@atlaskit/primitives';

<Text weight="medium">...</Text>;
Was this page helpful?
We use this feedback to improve our documentation.
  • Design system
    • Get started
    • Foundations
    • Components
    • Rovo UI
    • Tools
    • Release phases
    • Contact us
© 2026 AtlassianTrademark, (opens new window)Privacy, (opens new window)License