Helsinki Design System
Documentation for the Helsinki Design System
āĻ¸ā§āĻā§āĻ°
70
āĻŦā§āĻ¯āĻŦāĻšāĻžāĻ°āĻāĻžāĻ°ā§āĻ° āĻ°ā§āĻāĻŋāĻ
3.0
āĻŦāĻŋāĻ¨āĻžāĻŽā§āĻ˛ā§āĻ¯ā§/āĻā§āĻ°āĻžāĻ¯āĻŧāĻžāĻ˛ āĻ¸āĻšāĻžāĻ¯āĻŧāĻ¤āĻž
āĻ¸āĻŽāĻ°ā§āĻĨāĻŋāĻ¤
āĻļā§āĻ°ā§āĻ° āĻŽā§āĻ˛ā§āĻ¯
--
āĻ¸āĻ°ā§āĻŦāĻļā§āĻˇ āĻāĻĒāĻĄā§āĻ
āĻāĻāĻ¸ā§āĻ 13, 2026
āĻ¸āĻāĻā§āĻˇāĻŋāĻĒā§āĻ¤āĻ¸āĻžāĻ°
Helsinki Design System āĻā§?
āĻšā§āĻ˛āĻ¸āĻŋāĻā§āĻāĻŋ āĻĄāĻŋāĻāĻžāĻāĻ¨ āĻ¸āĻŋāĻ¸ā§āĻā§āĻŽ āĻšāĻ˛ āĻĄāĻŋāĻāĻžāĻāĻ¨ā§āĻ° āĻ¨ā§āĻ¤āĻŋ, āĻāĻĒāĻžāĻĻāĻžāĻ¨ āĻāĻŦāĻ āĻ¸āĻ°āĻā§āĻāĻžāĻŽāĻā§āĻ˛āĻŋāĻ° āĻāĻāĻāĻŋ āĻ¸āĻāĻā§āĻ°āĻš āĻ¯āĻž āĻĻāĻ˛āĻā§āĻ˛āĻŋāĻā§ āĻ¸āĻŽāĻ¨ā§āĻŦāĻŋāĻ¤ āĻāĻŦāĻ āĻ ā§āĻ¯āĻžāĻā§āĻ¸ā§āĻ¸āĻ¯ā§āĻā§āĻ¯ āĻĄāĻŋāĻāĻŋāĻāĻžāĻ˛ āĻĒāĻŖā§āĻ¯ āĻ¤ā§āĻ°āĻŋ āĻāĻ°āĻ¤ā§ āĻ¸āĻšāĻžāĻ¯āĻŧāĻ¤āĻž āĻāĻ°ā§ā§ˇ
Helsinki Design System āĻā§ āĻāĻžāĻā§ āĻŦā§āĻ¯āĻŦāĻšā§āĻ¤ āĻšāĻ¯āĻŧ?
āĻļā§āĻ°ā§āĻˇ āĻŦā§āĻļāĻŋāĻˇā§āĻā§āĻ¯
- āĻĒā§āĻ¨āĻ°āĻžāĻ¯āĻŧ āĻŦā§āĻ¯āĻŦāĻšāĻžāĻ°āĻ¯ā§āĻā§āĻ¯ UI āĻāĻĒāĻžāĻĻāĻžāĻ¨
- āĻ ā§āĻ¯āĻžāĻā§āĻ¸ā§āĻ¸āĻ¯ā§āĻā§āĻ¯āĻ¤āĻžāĻ° āĻ¨āĻŋāĻ°ā§āĻĻā§āĻļāĻŋāĻāĻž
- āĻĄāĻŋāĻāĻžāĻāĻ¨ āĻā§āĻā§āĻ¨ āĻāĻŦāĻ āĻļā§āĻ˛ā§
- āĻĄāĻā§āĻŽā§āĻ¨ā§āĻā§āĻļāĻ¨ āĻāĻŦāĻ āĻāĻĻāĻžāĻšāĻ°āĻŖ
Helsinki Design System āĻā§āĻāĻžāĻŦā§ āĻŦā§āĻ¯āĻŦāĻšāĻžāĻ° āĻāĻ°āĻŦā§āĻ¨?
āĻāĻ¯āĻŧā§āĻŦ āĻĒā§āĻ°ā§āĻā§āĻā§āĻā§ āĻāĻĒāĻžāĻĻāĻžāĻ¨āĻā§āĻ˛āĻŋāĻā§ āĻāĻā§āĻā§āĻ¤ āĻāĻ°āĻ¤ā§ āĻĄāĻā§āĻŽā§āĻ¨ā§āĻā§āĻļāĻ¨ āĻ ā§āĻ¯āĻžāĻā§āĻ¸ā§āĻ¸ āĻāĻ°ā§āĻ¨, āĻĄāĻŋāĻāĻžāĻāĻ¨ā§āĻ° āĻ¸āĻžāĻŽāĻā§āĻāĻ¸ā§āĻ¯ā§āĻ° āĻāĻ¨ā§āĻ¯ āĻ¨āĻŋāĻ°ā§āĻĻā§āĻļāĻŋāĻāĻž āĻ āĻ¨ā§āĻ¸āĻ°āĻŖ āĻāĻ°ā§āĻ¨ āĻāĻŦāĻ āĻāĻ¨ā§āĻ¨āĻ¯āĻŧāĻ¨ā§āĻ° āĻāĻ¨ā§āĻ¯ āĻ¸āĻāĻ¸ā§āĻĨāĻžāĻ¨āĻā§āĻ˛āĻŋ āĻŦā§āĻ¯āĻŦāĻšāĻžāĻ° āĻāĻ°ā§āĻ¨ā§ˇ
āĻŦāĻŋāĻāĻ˛ā§āĻĒ āĻā§āĻ˛
āĻā§āĻ¨ āĻŦāĻŋāĻāĻ˛ā§āĻĒ āĻā§āĻ˛ āĻĒāĻžāĻāĻ¯āĻŧāĻž āĻ¯āĻžāĻ¯āĻŧāĻ¨āĻŋ
āĻ¸ā§āĻŦāĻŋāĻ§āĻž & āĻ āĻ¸ā§āĻŦāĻŋāĻ§āĻž
āĻ¸ā§āĻŦāĻŋāĻ§āĻž
- āĻĒā§āĻ°āĻāĻ˛ā§āĻĒ āĻā§āĻĄāĻŧā§ āĻ§āĻžāĻ°āĻžāĻŦāĻžāĻšāĻŋāĻāĻ¤āĻž āĻĒā§āĻ°āĻāĻžāĻ° āĻāĻ°ā§
- āĻ ā§āĻ¯āĻžāĻā§āĻ¸ā§āĻ¸āĻ¯ā§āĻā§āĻ¯āĻ¤āĻž āĻ¸āĻŽā§āĻŽāĻ¤āĻŋ āĻŦāĻžāĻĄāĻŧāĻžāĻ¯āĻŧ
- āĻĒā§āĻ°āĻžāĻ-āĻ¨āĻŋāĻ°ā§āĻŽāĻŋāĻ¤ āĻāĻĒāĻžāĻĻāĻžāĻ¨āĻā§āĻ˛āĻŋāĻ° āĻ¸āĻžāĻĨā§ āĻŦāĻŋāĻāĻžāĻļā§āĻ° āĻ¸āĻŽāĻ¯āĻŧ āĻ¸āĻāĻ°āĻā§āĻˇāĻŖ āĻāĻ°ā§
āĻ āĻ¸ā§āĻŦāĻŋāĻ§āĻž
- āĻ¨āĻ¤ā§āĻ¨ āĻŦā§āĻ¯āĻŦāĻšāĻžāĻ°āĻāĻžāĻ°ā§āĻĻā§āĻ° āĻāĻ¨ā§āĻ¯ āĻļā§āĻāĻžāĻ° āĻŦāĻā§āĻ°āĻ°ā§āĻāĻž āĻĒā§āĻ°āĻ¯āĻŧā§āĻāĻ¨ āĻšāĻ¤ā§ āĻĒāĻžāĻ°ā§
- āĻāĻ¯āĻŧā§āĻŦ āĻĒā§āĻ˛ā§āĻ¯āĻžāĻāĻĢāĻ°ā§āĻŽā§ āĻ¸ā§āĻŽāĻžāĻŦāĻĻā§āĻ§
āĻŦā§āĻ¯āĻŦāĻšāĻžāĻ°ā§āĻ° āĻā§āĻˇā§āĻ¤ā§āĻ°ā§
- āĻ ā§āĻ¯āĻžāĻā§āĻ¸ā§āĻ¸āĻ¯ā§āĻā§āĻ¯ āĻāĻ¯āĻŧā§āĻŦāĻ¸āĻžāĻāĻ āĻ¤ā§āĻ°āĻŋ āĻāĻ°āĻž
- āĻŦāĻĄāĻŧ āĻĻāĻ˛ā§ āĻĄāĻŋāĻāĻžāĻāĻ¨ā§āĻ° āĻ§āĻžāĻ°āĻžāĻŦāĻžāĻšāĻŋāĻāĻ¤āĻž āĻŦāĻāĻžāĻ¯āĻŧ āĻ°āĻžāĻāĻž
- āĻĒā§āĻ°ā§āĻŦ-āĻĒāĻ°āĻŋāĻāĻ˛ā§āĻĒāĻŋāĻ¤ āĻāĻĒāĻžāĻĻāĻžāĻ¨āĻā§āĻ˛āĻŋāĻ° āĻ¸āĻžāĻĨā§ āĻĻā§āĻ°ā§āĻ¤ āĻĒā§āĻ°ā§āĻā§āĻāĻžāĻāĻĒāĻŋāĻ
Helsinki Design System āĻŽā§āĻ˛ā§āĻ¯
āĻŦāĻŋāĻ¨āĻžāĻŽā§āĻ˛ā§āĻ¯ā§ āĻĒāĻ°āĻŋāĻāĻ˛ā§āĻĒāĻ¨āĻž
āĻā§āĻ¨ āĻŦāĻŋāĻļāĻĻ āĻŽā§āĻ˛ā§āĻ¯ āĻ¤āĻĨā§āĻ¯ āĻāĻĒāĻ˛āĻŦā§āĻ§ āĻ¨ā§āĻ
āĻŦā§āĻ¯āĻŦāĻšāĻžāĻ°āĻāĻžāĻ°ā§āĻ° āĻĒāĻ°ā§āĻ¯āĻžāĻ˛ā§āĻāĻ¨āĻž
3.0
ā§Ģ āĻāĻ° āĻŽāĻ§ā§āĻ¯ā§
3.0
āĻāĻāĻ¨āĻ āĻā§āĻ¨ āĻĒāĻ°ā§āĻ¯āĻžāĻ˛ā§āĻāĻ¨āĻž āĻ¨ā§āĻ
āĻāĻ āĻā§āĻ˛ā§āĻ° āĻĒā§āĻ°āĻĨāĻŽ āĻĒāĻ°ā§āĻ¯āĻžāĻ˛ā§āĻāĻ¨āĻžāĻāĻžāĻ°ā§ āĻšāĻ¨!