Gogledd-Orllewin

The text rendering for the Pudsey Clough Radio app, influenced by 90s rave flyers and The Designers Republic classic close kerned text and line height lower than type size. Typeface used is Special Gothic Expanded One.

@Composable
fun RaveText(
    text: String,
    modifier: Modifier,
    lineHeight: Float = 100f
) {
    Text(
        text = text.uppercase(),
        autoSize = TextAutoSize.StepBased(
            minFontSize = 24.sp,
            maxFontSize = 600.sp
        ),
        modifier = modifier.then(
            Modifier
                .fillMaxSize()
                .padding(horizontal = 4.dp)
                .graphicsLayer {
                    compositingStrategy = CompositingStrategy.Offscreen
                    blendMode = BlendMode.Difference
                }
        ),
        color = Color.White,
        fontFamily = FontFamily(Font(R.font.special_gothic_expanded_one_regular)),
        fontWeight = FontWeight.Black,
        textAlign = TextAlign.Center,
        lineHeight = lineHeight.sp,
    )
}

Note. you'll need the latest alpha of Material3, the current release does not include the autoSize arg.

A test layout, tap to rebuild the text:

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        setContent {

            var recomposeKey by remember { mutableStateOf(0) }

            RaveTextTheme {
                Scaffold(modifier = Modifier.fillMaxSize()) { innerPadding ->
                    Box(
                        modifier = Modifier.fillMaxSize().clickable(onClick = {
                            recomposeKey += 1
                        }),
                        contentAlignment = Alignment.Center) {
                        key(recomposeKey) {
                            Box(modifier = Modifier.height(listOf(100.dp, 160.dp, 200.dp, 250.dp, 300.dp, 500.dp, 800.dp).random())) {
                                RaveText(
                                    text = "Pudsey Clough",
                                    modifier = Modifier.align(Alignment.Center),
                                    lineHeight = listOf(40f, 60f, 90f, 110f, 140f).random()
                                )
                            }
                        }
                    }
                }
            }
        }
    }
}