Kształt
Jeden bazowy promień steruje każdym narożnikiem w systemie. Zmień jedną zmienną, a cały interfejs proporcjonalnie się dostosuje — od ostrego i technicznego po miękki i przyjazny.
Narożniki w prfct wynikają z jednej zmiennej: --radius (domyślnie 8 px). Każdy stopień skali zaokrągleń jest jej wielokrotnością, więc zmiana wartości bazowej zachowuje wszystkie proporcje — łącznie z 0, które daje całkowicie ostry system.
Wcięcia pierścienia fokusu, drobne wskaźniki
Pola wyboru, kbd, małe odznaki
Małe przyciski i pola
Przyciski, pola, listy wyboru, pozycje menu
Karty, popovery, menu
Okna dialogowe, panele, duże karty
Kafelki marketingowe
Media w sekcjach hero
:root {
--radius: 0.5rem; /* try 0, 0.25rem or 0.75rem */
}Koncentryczne narożniki
Gdy jeden zaokrąglony kształt leży wewnątrz drugiego, promień wewnętrzny powinien być równy promieniowi zewnętrznemu pomniejszonemu o odstęp między nimi. Przy równych promieniach wewnętrzny kształt wygląda, jakby się wybrzuszał; promienie koncentryczne wyglądają jak wyfrezowane.
Komponenty prfct są już koncentryczne: menu z promieniem 12 px i wypełnieniem 4 px mieści pozycje z promieniem 8 px. Gdy wypełnienie jest większe niż promień zewnętrzny — jak w oknie dialogowym z promieniem 16 px i wypełnieniem 24 px — kształty wewnętrzne są zbyt daleko, by z nim konkurować, i zachowują własny promień.